@import url("https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700;800&family=Inter:wght@400;500;600;700&display=swap");

:root {
  --abyss-bg: #03070d;
  --abyss-panel: rgba(5, 15, 26, .88);
  --abyss-panel-2: rgba(6, 24, 42, .92);
  --abyss-blue: #00a6ff;
  --abyss-blue-soft: #5fd7ff;
  --abyss-gold: #d8a84b;
  --abyss-gold-2: #ffe19b;
  --abyss-line: rgba(216, 168, 75, .58);
  --abyss-text: #f4ead4;
  --abyss-muted: #a9bdd1;
  --abyss-radius: 8px;
  --abyss-shadow: 0 24px 80px rgba(0, 0, 0, .55);
  --abyss-min-layout-width: 1500px;
}

* { box-sizing: border-box; }

html {
  min-height: 100%;
  min-width: var(--abyss-min-layout-width);
  overflow-x: auto;
  background: var(--abyss-bg);
}

body {
  margin: 0;
  min-height: 100%;
  min-width: var(--abyss-min-layout-width);
  color: var(--abyss-text);
  font-family: Inter, Verdana, Arial, sans-serif;
  background-color: var(--abyss-bg);
  background-image: url("images/abyssal/Home 1.png");
  background-size: cover;
  background-position: center top;
  background-attachment: fixed;
  background-repeat: no-repeat;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -2;
  background:
    radial-gradient(circle at 50% 7%, rgba(0, 166, 255, .24), transparent 28rem),
    linear-gradient(180deg, rgba(3, 7, 13, .38), #03070d 76%);
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.02) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom, transparent, #000 20%, #000 75%, transparent);
}

body.abyss-intro-screen {
  min-height: 100vh;
  overflow: hidden;
  background-image: url("images/abyssal/Home 1.png") !important;
  background-size: cover;
  background-position: center center;
  background-attachment: fixed;
}

body.abyss-intro-screen::before {
  background:
    radial-gradient(circle at 50% 44%, rgba(0, 166, 255, .16), transparent 28rem),
    linear-gradient(180deg, rgba(3, 7, 13, .08), rgba(3, 7, 13, .38));
}

.abyss-intro {
  position: fixed;
  inset: 0;
  z-index: 1000;
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 6vh 7vw;
  background:
    radial-gradient(circle at 50% 48%, rgba(0, 166, 255, .10), transparent 32rem),
    linear-gradient(180deg, rgba(3, 7, 13, .10), rgba(3, 7, 13, .30));
  transition: opacity .7s ease .45s, visibility .7s ease .45s;
}

.abyss-intro-logo {
  display: block;
  width: min(860px, 78vw);
  animation: abyssFloat 5.5s ease-in-out infinite;
  filter:
    drop-shadow(0 28px 34px rgba(0, 0, 0, .54))
    drop-shadow(0 0 20px rgba(0, 166, 255, .28));
  transition: transform .18s ease, filter .18s ease;
  will-change: transform, opacity;
}

.abyss-intro-logo:hover,
.abyss-intro-logo:focus-visible {
  transform: scale(1.025);
  filter:
    drop-shadow(0 30px 36px rgba(0, 0, 0, .58))
    drop-shadow(0 0 26px rgba(0, 166, 255, .44));
  outline: 0;
}

.abyss-intro-logo img {
  display: block;
  width: 100%;
  height: auto;
}

body.abyss-intro-screen #ArtworkHelper {
  opacity: 0;
  pointer-events: none;
  transition: opacity .55s ease;
}

body.abyss-intro-screen #MenuColumn {
  opacity: 0;
  transform: translateX(-90px);
  transition: opacity .72s ease .32s, transform .72s cubic-bezier(.2, .8, .2, 1) .32s;
}

body.abyss-intro-screen #ContentColumn {
  opacity: 0;
  transform: translateY(90px);
  transition: opacity .78s ease .22s, transform .78s cubic-bezier(.2, .8, .2, 1) .22s;
}

body.abyss-intro-screen #ThemeboxesColumn {
  opacity: 0;
  transform: translateX(90px);
  transition: opacity .72s ease .42s, transform .72s cubic-bezier(.2, .8, .2, 1) .42s;
}

body.abyss-is-entering .abyss-intro {
  opacity: 0;
  visibility: hidden;
}

body.abyss-is-entering .abyss-intro-logo {
  transform: translateY(-34vh) scale(.72);
  opacity: 0;
  transition: transform .8s cubic-bezier(.2, .8, .2, 1), opacity .55s ease .2s, filter .3s ease;
}

body.abyss-is-entering #ArtworkHelper,
body.abyss-entered #ArtworkHelper {
  opacity: 1;
  pointer-events: auto;
}

body.abyss-is-entering #MenuColumn,
body.abyss-is-entering #ContentColumn,
body.abyss-is-entering #ThemeboxesColumn,
body.abyss-entered #MenuColumn,
body.abyss-entered #ContentColumn,
body.abyss-entered #ThemeboxesColumn {
  opacity: 1;
  transform: translate(0, 0);
}

a { color: var(--abyss-blue-soft); text-decoration: none; }
a:hover { color: var(--abyss-gold-2); }
img { border: 0; max-width: 100%; }

#top, #ArtworkHelper, #Bodycontainer, #ContentRow {
  width: 100%;
}

#ArtworkHelper {
  position: relative;
  z-index: 1;
  min-width: var(--abyss-min-layout-width);
}

.abyss-shell {
  width: min(1280px, calc(100% - 96px));
  margin: 0 auto;
  padding: 18px 0 28px;
}

#Bodycontainer.abyss-shell {
  width: min(1750px, calc(100% - 150px));
  min-width: 1420px;
  margin-left: auto;
  margin-right: auto;
}

.abyss-hero {
  position: relative;
  min-height: 0;
  height: clamp(340px, 34vw, 520px);
  border: 0;
  border-radius: 0;
  overflow: hidden;
  background-color: transparent;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  box-shadow: 0 18px 52px rgba(0, 0, 0, .5);
}

.abyss-hero::before {
  display: none;
}

.abyss-hero::after {
  display: none;
}

.abyss-hero-content {
  display: none;
}

.abyss-brand {
  margin: 0;
  font-family: Georgia, "Times New Roman", Cinzel, serif;
  font-size: clamp(58px, 7vw, 118px);
  line-height: .88;
  letter-spacing: 0;
  text-transform: uppercase;
  color: #ffe7aa;
  background: linear-gradient(180deg, #fff3c6 0%, #ffd678 46%, #a86415 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow:
    0 2px 0 rgba(58, 31, 6, .9),
    0 0 12px rgba(255, 219, 135, .45),
    0 0 18px rgba(0, 166, 255, .86),
    0 0 46px rgba(0, 0, 0, .95);
  filter: drop-shadow(0 0 12px rgba(0, 166, 255, .54));
}

.abyss-tagline {
  margin: 18px 0 0;
  font-family: Georgia, "Times New Roman", Cinzel, serif;
  font-size: clamp(20px, 2.1vw, 32px);
  color: #ffe7aa;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0;
  text-shadow:
    0 1px 0 rgba(58, 31, 6, .9),
    0 0 10px rgba(0, 166, 255, .56),
    0 0 26px rgba(0, 0, 0, .9);
}

.abyss-topbar {
  position: relative;
  z-index: 50;
  left: 50%;
  width: 1100px;
  margin: -8px 0 10px;
  transform: translateX(-50%);
  aspect-ratio: 2132 / 128;
  display: block;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: url("images/abyssal/imagegen-topbar-abyssal-v4-players-wide-goldmatch.png?v=20260530-topbar-v4") center center / 100% auto no-repeat;
  box-shadow: none;
  overflow: visible;
  isolation: isolate;
}

.abyss-action {
  position: absolute;
  top: 24%;
  height: 52%;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 0;
  color: #f1c45b;
  font-family: Georgia, "Times New Roman", Cinzel, serif;
  font-weight: 800;
  font-size: 12px;
  line-height: 1;
  text-transform: uppercase;
  text-align: center;
  white-space: nowrap;
  border: 0;
  border-radius: 0;
  background: transparent;
  text-shadow:
    0 1px 0 rgba(41, 20, 2, .95),
    0 0 7px rgba(255, 197, 79, .5),
    0 0 11px rgba(0, 166, 255, .45);
  box-shadow: none;
  transition: background .2s ease;
}

.abyss-action--download {
  left: 6.4%;
  width: 14.4%;
}

.abyss-action--whatsapp {
  left: 20.5%;
  width: 15.0%;
}

.abyss-action--discord {
  left: 35.5%;
  width: 14.5%;
}

.abyss-action--instagram {
  left: 50.3%;
  width: 14.0%;
}

.abyss-action--facebook {
  left: 64.5%;
  width: 10.8%;
}

.abyss-action::before {
  display: none;
}

.abyss-action::after {
  display: none;
}

.abyss-action:last-child { border-right: 0; }

.abyss-action--players {
  left: 75.9%;
  top: 24%;
  width: 21.3%;
  height: 51;
}

.abyss-action:hover {
  background: rgba(0, 166, 255, .12);
  transform: none;
  box-shadow: none;
}

.abyss-action--players:hover {
  box-shadow: -0.3cm 0 0 rgba(0, 166, 255, .12);
}

.abyss-action i,
.abyss-action svg {
  display: inline-block;
  flex: 0 0 auto;
  width: 26px;
  font-size: 26px;
  line-height: 1;
  color: #d89a2b;
  filter:
    drop-shadow(0 1px 0 rgba(41, 20, 2, .9))
    drop-shadow(0 0 5px rgba(255, 203, 82, .42));
}

.abyss-action span {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: auto;
  height: auto;
  overflow: visible;
  clip: auto;
  display: inline-block;
  max-width: 100%;
  color: #f1c45b;
  font-weight: 800;
  line-height: 1.05;
  white-space: normal;
}

.abyss-action--players .abyss-action-label {
  white-space: nowrap;
}

.abyss-action.is-players-online .abyss-player-count {
  display: none;
}

.abyss-player-count {
  position: absolute;
  left: 72%;
  top: 50%;
  min-width: 10px;
  transform: translate(-50%, -50%);
  display: block;
  font-family: Cinzel, Georgia, serif;
  color: #fff0b8;
  font-size: 24px;
  font-weight: 600;
  line-height: 1;
  text-align: center;
  border: 0;
  background: transparent;
  box-shadow: none;
  text-shadow:
    0 2px 0 rgba(55, 29, 4, .95),
    0 0 9px rgba(0, 166, 255, .86),
    0 0 14px rgba(255, 191, 73, .48);
  pointer-events: none;
}

.abyss-layout {
  display: grid;
  grid-template-columns: 430px minmax(0, 1fr) 207px;
  gap: 24px;
  align-items: start;
}

#MenuColumn, #ContentColumn, #ThemeboxesColumn {
  position: static;
  width: auto;
  margin: 0;
  padding: 0;
}

#MenuColumn,
#ThemeboxesColumn {
  padding-top: 582px;
}

#MenuColumn {
  padding-top: 548px;
}

#ContentColumn { min-width: 0; }
#ThemeboxesColumn { text-align: center; }

.abyss-main-content-anchor {
  display: block;
  height: 0;
  scroll-margin-top: 18px;
}

#RightArtwork {
  position: relative;
  width: 150%;
  aspect-ratio: 1536 / 960;
  margin: -4.3cm 0 -39px -1.5cm;
  background: url("images/abyssal/boosted-podium.png?v=20260527-121517") center center / contain no-repeat;
  filter: drop-shadow(0 14px 18px rgba(0, 0, 0, .58));
  overflow: visible;
}

#RightArtwork::after {
  display: none;
}

#RightArtwork #Creature,
#RightArtwork #Boss {
  position: absolute;
  z-index: 2;
  width: 80px;
  height: 80px;
  object-fit: contain;
  image-rendering: auto;
  filter:
    drop-shadow(0 2px 0 rgba(0, 0, 0, .75))
    drop-shadow(0 0 8px rgba(0, 166, 255, .5));
}

#RightArtwork #Creature {
  left: 29%;
  top: -9%;
  transform: translateX(calc(-50% - 0.5cm));
}

#RightArtwork #Boss {
  left: 68%;
  top: -9%;
  transform: translateX(calc(-50% - 0.5cm));
}

.abyss-home-top {
  display: block;
  position: relative;
  left: 0.30cm;
  width: 100%;
  aspect-ratio: 1230 / 470;
  height: auto;
  margin: -8px 0 6px;
  padding: 0;
  overflow: visible;
  pointer-events: auto;
  cursor: pointer;
  animation: abyssFloat 5.5s ease-in-out infinite;
  filter:
    drop-shadow(0 18px 28px rgba(0, 0, 0, .42))
    drop-shadow(0 0 16px rgba(0, 166, 255, .22));
  will-change: transform;
}

.abyss-home-top:hover,
.abyss-home-top:focus-visible {
  outline: 0;
  filter:
    drop-shadow(0 20px 30px rgba(0, 0, 0, .46))
    drop-shadow(0 0 22px rgba(0, 166, 255, .34));
}

.abyss-home-top img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  object-position: center center;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

@keyframes abyssFloat {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-8px);
  }
}

.abyss-login-mini,
#Menu,
.Content .Box,
.Themebox,
.discord,
.serversave,
#Themeboxes > div {
  border: 1px solid var(--abyss-line);
  border-radius: var(--abyss-radius);
  background:
    linear-gradient(180deg, rgba(7, 29, 51, .94), rgba(2, 8, 15, .94)),
    radial-gradient(circle at 50% 0, rgba(0, 166, 255, .22), transparent 70%);
  box-shadow: inset 0 0 0 1px rgba(0, 166, 255, .18), 0 14px 34px rgba(0, 0, 0, .36);
}

.abyss-login-mini {
  position: relative;
  width: calc(100% + 15px);
  aspect-ratio: 1020 / 825;
  padding: 0;
  margin: 0 -5px 0;
  border: 0;
  background: url("images/abyssal/Login1-abyssal-goldmatch-v1.png?v=20260530-login-goldmatch-v1") center center / 129% 100% no-repeat;
  box-shadow: none;
  overflow: visible;
  transform: translateX(0);
}

.abyss-login-mini.is-logged {
  aspect-ratio: 1020 / 825;
  background-image: url("images/abyssal/Login2-abyssal-goldmatch-v1.png?v=20260530-login-goldmatch-v1");
  background-size: 129% 100%;
  transform: translateX(0);
}

.abyss-mini-logo {
  display: none;
  margin-bottom: 10px;
  font-family: Cinzel, Georgia, serif;
  color: var(--abyss-gold-2);
  font-size: 24px;
  font-weight: 800;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 0 0 16px rgba(0, 166, 255, .72);
}

.fantasy-button,
.BigButtonText,
button,
input[type="submit"],
input[type="button"] {
  appearance: none;
  min-height: 42px;
  border: 1px solid rgba(216, 168, 75, .74);
  border-radius: 6px;
  background: linear-gradient(180deg, #0d3765, #04101d);
  color: var(--abyss-gold-2) !important;
  font-family: Cinzel, Georgia, serif;
  font-weight: 800;
  text-transform: uppercase;
  text-shadow: 0 1px 0 #000;
  box-shadow: inset 0 0 18px rgba(0, 166, 255, .28), 0 0 18px rgba(0, 166, 255, .14);
  cursor: pointer;
}

.fantasy-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 8px 10px;
  font-size: 13px;
}

.abyss-login-mini .fantasy-button {
  position: absolute;
  left: 31.25%;
  width: 37.5%;
  min-height: 0;
  height: 12%;
  padding: 0;
  color: transparent !important;
  font-size: 0;
  line-height: 0;
  text-indent: -9999px;
  text-shadow: none;
  border: 0;
  background: transparent;
  box-shadow:
    0 8px 16px rgba(0, 0, 0, .46),
    0 0 10px rgba(0, 166, 255, .46),
    0 0 8px rgba(255, 205, 91, .24),
    inset 0 0 14px rgba(0, 166, 255, .32);
  overflow: hidden;
  transition: box-shadow .18s ease, transform .18s ease;
}

.abyss-login-mini .abyss-login-mini__primary {
  top: 57.6%;
}

.abyss-login-mini .abyss-login-mini__secondary {
  left: 34%;
  width: 32%;
  top: 71.8%;
  height: 8%;
}

.abyss-login-mini.is-logged .abyss-login-mini__primary {
  left: 24.8%;
  width: 50.8%;
  top: 55.6%;
  height: 12.2%;
}

.abyss-login-mini.is-logged .abyss-login-mini__secondary {
  left: 30.4%;
  width: 40%;
  top: 71.8%;
  height: 7.2%;
}

.abyss-login-mini .fantasy-button:hover,
.abyss-login-mini .fantasy-button:focus-visible {
  background: transparent;
  box-shadow:
    0 10px 18px rgba(0, 0, 0, .52),
    0 0 14px rgba(0, 166, 255, .72),
    0 0 10px rgba(255, 205, 91, .40),
    inset 0 0 18px rgba(0, 166, 255, .42);
  outline: 0;
  transform: scale(1.02);
}

.abyss-download-art {
  display: block;
  width: calc(100% + 18px);
  aspect-ratio: 1419 / 498;
  margin: -6px -9px 0;
  background: url("images/abyssal/Dowlonad-novo-cropped.png") center center / 100% 100% no-repeat;
  filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .42));
  transform-origin: center;
  transition: filter .18s ease, transform .18s ease;
}

.abyss-download-art:hover,
.abyss-download-art:focus-visible {
  filter:
    drop-shadow(0 12px 20px rgba(0, 0, 0, .5))
    drop-shadow(0 0 10px rgba(0, 166, 255, .75))
    drop-shadow(0 0 8px rgba(255, 205, 91, .42));
  transform: scale(1.035);
}

.abyss-premium-box {
  position: relative !important;
  width: 188px;
  height: 238px !important;
  min-height: 238px;
  margin: 12px auto 18px !important;
  padding: 0;
  border: 1px solid rgba(255, 211, 98, .95) !important;
  border-radius: 8px !important;
  background-image: none !important;
  background:
    radial-gradient(circle at 50% 28%, rgba(0, 177, 255, .46), transparent 58px),
    radial-gradient(circle at 50% 72%, rgba(255, 193, 53, .25), transparent 78px),
    linear-gradient(180deg, rgba(11, 39, 65, .98), rgba(3, 10, 18, .98) 54%, rgba(5, 19, 31, .98)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 240, 156, .35),
    inset 0 0 28px rgba(0, 177, 255, .28),
    0 0 20px rgba(255, 194, 54, .42),
    0 18px 34px rgba(0, 0, 0, .58) !important;
  isolation: isolate;
  overflow: hidden !important;
  animation: abyssPremiumGlow 2.8s ease-in-out infinite;
}

.abyss-premium-box::before {
  content: "";
  position: absolute;
  inset: 7px;
  z-index: 1;
  pointer-events: none;
  border: 1px solid rgba(255, 231, 142, .62);
  border-radius: 6px;
  box-shadow:
    inset 0 0 0 1px rgba(0, 177, 255, .18),
    inset 0 0 24px rgba(0, 0, 0, .42);
}

.abyss-premium-box::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(110deg, transparent 0 33%, rgba(255, 255, 255, .16) 44%, transparent 55%),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, .035) 0 1px, transparent 1px 23px);
  opacity: .38;
  animation: abyssPremiumSweep 4.8s ease-in-out infinite;
}

.abyss-premium-frame {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
}

.abyss-premium-frame::before,
.abyss-premium-frame::after {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  height: 18px;
  border: 1px solid rgba(255, 211, 98, .72);
  background: linear-gradient(180deg, #75124b, #3d0731);
  box-shadow:
    inset 0 1px 0 rgba(255, 238, 163, .42),
    0 0 12px rgba(255, 190, 53, .35);
}

.abyss-premium-frame::before {
  top: 9px;
}

.abyss-premium-frame::after {
  bottom: 9px;
}

.abyss-premium-spark {
  position: absolute;
  z-index: 8;
  width: 43px;
  height: 43px;
  top: 2px;
  pointer-events: none;
  background:
    radial-gradient(circle, rgba(255, 241, 156, .95) 0 2px, transparent 3px),
    linear-gradient(45deg, transparent 39%, rgba(255, 209, 80, .9) 40% 60%, transparent 61%),
    linear-gradient(-45deg, transparent 39%, rgba(255, 209, 80, .9) 40% 60%, transparent 61%);
  filter: drop-shadow(0 0 7px rgba(255, 206, 82, .8));
}

.abyss-premium-spark--left {
  left: -1px;
}

.abyss-premium-spark--right {
  right: -1px;
}

.abyss-premium-copy {
  position: relative;
  z-index: 5;
  padding: 32px 14px 0;
  text-align: center;
}

.abyss-premium-kicker,
.abyss-premium-title,
.abyss-premium-tagline,
.abyss-premium-benefit {
  display: block;
  text-shadow: 0 1px 0 #000, 0 0 9px rgba(0, 177, 255, .68);
}

.abyss-premium-kicker {
  color: #f9d36d;
  font-family: Cinzel, Georgia, serif;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  text-transform: uppercase;
}

.abyss-premium-title {
  margin-top: 3px;
  color: #fff6c7;
  font-family: Cinzel, Georgia, serif;
  font-size: 20px;
  font-weight: 800;
  line-height: 1.05;
  text-transform: uppercase;
}

.abyss-premium-tagline {
  margin-top: 4px;
  color: #c9ecff;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.15;
}

.abyss-premium-art {
  position: absolute;
  z-index: 4;
  left: 24px;
  right: 24px;
  top: 83px;
  height: 66px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  filter:
    drop-shadow(0 9px 10px rgba(0, 0, 0, .65))
    drop-shadow(0 0 9px rgba(255, 205, 75, .5));
}

.abyss-premium-decor {
  position: absolute;
  z-index: 6;
  top: 71px;
  right: 19px;
  width: 42px;
  height: 42px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  filter: drop-shadow(0 0 8px rgba(255, 214, 88, .65));
}

.abyss-premium-badge {
  position: absolute;
  z-index: 7;
  left: 18px;
  top: 112px;
  min-width: 62px;
  height: 20px;
  padding: 0 8px;
  border: 1px solid rgba(255, 218, 107, .82);
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(111, 13, 71, .98), rgba(42, 5, 35, .98));
  box-shadow: 0 0 12px rgba(255, 199, 64, .34);
}

.abyss-premium-box #PremiumBoxOverlayText {
  margin: 0;
  color: #fff4be !important;
  font-family: Cinzel, Georgia, serif !important;
  font-weight: 800 !important;
  font-size: 10px;
  line-height: 18px;
  text-align: center;
  text-transform: uppercase;
  text-shadow:
    0 1px 0 #000,
    0 0 7px rgba(255, 203, 71, .78) !important;
}

.abyss-premium-benefit {
  position: absolute;
  z-index: 5;
  left: 17px;
  right: 17px;
  bottom: 59px;
  margin: 0;
  color: #eaf8ff;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.18;
  text-align: center;
  text-transform: uppercase;
}

.abyss-premium-box #PremiumBoxButton {
  position: absolute;
  left: 13px;
  right: 13px;
  bottom: 27px;
  z-index: 35;
}

.abyss-premium-box #PremiumBoxButton form {
  padding: 0;
  margin: 0;
}

.abyss-premium-box #PremiumBoxButton .BigButton {
  width: 100% !important;
  height: 38px !important;
  border: 1px solid rgba(255, 232, 120, .98);
  border-radius: 6px;
  background:
    linear-gradient(180deg, rgba(255, 231, 115, .98), rgba(199, 125, 23, .98) 49%, rgba(8, 77, 103, .98) 50%, rgba(2, 25, 40, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 225, .72),
    inset 0 -8px 16px rgba(0, 191, 255, .3),
    0 0 15px rgba(255, 207, 66, .72),
    0 0 20px rgba(0, 177, 255, .48);
  transform-origin: center;
  transition: box-shadow .18s ease, transform .18s ease, filter .18s ease;
}

.abyss-premium-box #PremiumBoxButton .BigButton:hover,
.abyss-premium-box #PremiumBoxButton .BigButton:focus-within {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 230, .6),
    inset 0 -8px 18px rgba(0, 191, 255, .42),
    0 0 16px rgba(255, 214, 82, .78),
    0 0 20px rgba(0, 180, 255, .55);
  filter: brightness(1.08);
  transform: scale(1.04);
}

.abyss-premium-box #PremiumBoxButton .BigButtonOver {
  display: none !important;
}

.abyss-premium-box #PremiumBoxButton .BigButtonText {
  width: 100% !important;
  height: 38px !important;
  min-height: 0;
  padding: 0 8px;
  border: 0;
  background: transparent !important;
  box-shadow: none;
  color: #fff3b6 !important;
  font-size: 13px;
  line-height: 38px;
  text-shadow:
    0 1px 0 #000,
    0 0 8px rgba(255, 220, 105, .8);
}

@keyframes abyssPremiumGlow {
  0%, 100% {
    box-shadow:
      inset 0 0 0 1px rgba(255, 230, 139, .32),
      inset 0 0 24px rgba(0, 166, 255, .2),
      0 0 16px rgba(255, 187, 45, .34),
      0 18px 34px rgba(0, 0, 0, .58);
  }
  50% {
    box-shadow:
      inset 0 0 0 1px rgba(255, 230, 139, .48),
      inset 0 0 28px rgba(0, 166, 255, .28),
      0 0 25px rgba(255, 198, 56, .62),
      0 18px 34px rgba(0, 0, 0, .58);
  }
}

@keyframes abyssPremiumSweep {
  0%, 100% {
    transform: translateX(-44px);
    opacity: .2;
  }
  45%, 55% {
    transform: translateX(44px);
    opacity: .45;
  }
}

.fantasy-button:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover {
  background: linear-gradient(180deg, #0f4e91, #051726);
  box-shadow: inset 0 0 22px rgba(0, 166, 255, .48), 0 0 22px rgba(0, 166, 255, .26);
}

#Menu {
  width: 270px;
  margin: 18px auto 0;
  overflow: hidden;
  padding: 0;
  border: 1px solid var(--abyss-line);
  background:
    linear-gradient(180deg, rgba(7, 29, 51, .94), rgba(2, 8, 15, .96)),
    radial-gradient(circle at 50% 0, rgba(0, 166, 255, .22), transparent 70%);
  box-shadow: inset 0 0 0 1px rgba(0, 166, 255, .18), 0 14px 34px rgba(0, 0, 0, .36);
}

.menuitem + .menuitem {
  border-top: 1px solid rgba(216, 168, 75, .34);
}

.MenuButton {
  position: relative;
  width: 100%;
  min-height: 44px;
  display: block;
  padding: 0;
  cursor: pointer;
  background: rgba(0, 0, 0, .12);
  border-bottom: 1px solid rgba(216, 168, 75, .28);
}

.MenuButton::before,
.SubmenuitemLabel::before {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  left: 15px;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
  border: 1px solid var(--abyss-gold);
  background: linear-gradient(135deg, #07345d, #00a6ff);
  box-shadow: 0 0 12px rgba(0, 166, 255, .8);
}

.MenuButton .Icon,
.MenuButton .Label,
.MenuButton .Lights,
.MenuButton .Button,
.MenuButton .Extend,
.LeftChain,
.RightChain,
.ActiveSubmenuItemIcon {
  display: none !important;
}

.MenuButton::after {
  content: attr(data-title);
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 38px;
  font-family: Cinzel, Georgia, serif;
  color: var(--abyss-gold-2);
  font-size: 17px;
  font-weight: 800;
  text-transform: uppercase;
  text-shadow: 0 0 12px rgba(0, 166, 255, .72);
}

.Submenu {
  width: 100%;
  display: none;
  background: rgba(1, 6, 12, .68);
}

.Submenu a {
  display: block;
  color: var(--abyss-text);
}

.Submenuitem {
  position: relative;
  min-height: 32px;
  border-bottom: 1px solid rgba(216, 168, 75, .28);
  background: rgba(0, 0, 0, .22);
}

.SubmenuitemLabel {
  position: relative;
  min-height: 32px;
  padding: 7px 10px 6px 38px;
  color: inherit !important;
  font-family: Georgia, serif;
  font-size: 14px;
  font-weight: 700;
  overflow: hidden;
}

.Submenuitem:hover {
  background: rgba(0, 166, 255, .15) !important;
}

#Menu.abyss-menu-art {
  position: relative;
  width: 270px;
  max-width: calc(100% + 12px);
  aspect-ratio: 495 / 1930;
  margin: -4px auto 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  overflow: visible;
  background-image: url("images/abyssal/Botões Completo.png");
  background-repeat: no-repeat;
  background-size: 438px 1067px;
  background-position: -84px -15px;
  box-shadow: none;
}

#Menu.abyss-menu-art .menuitem,
#Menu.abyss-menu-art .Submenu {
  display: contents !important;
}

#Menu.abyss-menu-art .MenuButton {
  position: absolute;
  left: 0;
  right: 0;
  z-index: 2;
  min-height: 0;
  height: 2.9%;
  padding: 0;
  border: 0;
  background: transparent !important;
  opacity: 0;
}

#Menu.abyss-menu-art .MenuButton::before,
#Menu.abyss-menu-art .MenuButton::after,
#Menu.abyss-menu-art .SubmenuitemLabel::before {
  display: none !important;
}

#Menu.abyss-menu-art .Submenu a {
  position: absolute;
  left: 8%;
  right: 5%;
  z-index: 3;
  height: 2.05%;
  display: block;
  border-radius: 2px;
  color: transparent !important;
  overflow: hidden;
}

#Menu.abyss-menu-art .Submenuitem,
#Menu.abyss-menu-art .SubmenuitemLabel {
  min-height: 0;
  height: 100%;
  padding: 0;
  border: 0;
  background: transparent !important;
  color: transparent !important;
  font-size: 0;
}

#Menu.abyss-menu-art .Submenu a:hover,
#Menu.abyss-menu-art .Submenu a:focus-visible {
  outline: 0;
  background: transparent;
  box-shadow: none;
}

#Menu.abyss-menu-art .menuitem:nth-of-type(1) .MenuButton { top: .98%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(2) .MenuButton { top: 11.83%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .MenuButton { top: 29.17%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(4) .MenuButton { top: 55.28%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(5) .MenuButton { top: 61.72%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(6) .MenuButton { top: 79.06%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(7) .MenuButton { top: 94.27%; }

#Menu.abyss-menu-art .menuitem:nth-of-type(1) .Submenu a:nth-child(1) { top: 4.33%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(1) .Submenu a:nth-child(2) { top: 6.56%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(1) .Submenu a:nth-child(3) { top: 8.74%; }

#Menu.abyss-menu-art .menuitem:nth-of-type(2) .Submenu a:nth-child(1) { top: 15.08%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(2) .Submenu a:nth-child(2) { top: 17.31%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(2) .Submenu a:nth-child(3) { top: 19.51%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(2) .Submenu a:nth-child(4) { top: 21.7%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(2) .Submenu a:nth-child(5) { top: 23.9%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(2) .Submenu a:nth-child(6) { top: 26.1%; }

#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(1) { top: 32.52%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(2) { top: 34.72%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(3) { top: 36.91%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(4) { top: 39.11%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(5) { top: 41.31%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(6) { top: 43.51%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(7) { top: 45.7%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(8) { top: 47.9%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(9) { top: 50.09%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(10) { top: 52.29%; }

#Menu.abyss-menu-art .menuitem:nth-of-type(4) .Submenu a:nth-child(1) { top: 58.68%; }

#Menu.abyss-menu-art .menuitem:nth-of-type(5) .Submenu a:nth-child(1) { top: 65.12%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(5) .Submenu a:nth-child(2) { top: 67.33%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(5) .Submenu a:nth-child(3) { top: 69.53%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(5) .Submenu a:nth-child(4) { top: 71.73%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(5) .Submenu a:nth-child(5) { top: 73.93%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(5) .Submenu a:nth-child(6) { top: 76.12%; }

#Menu.abyss-menu-art .menuitem:nth-of-type(6) .Submenu a:nth-child(1) { top: 82.48%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(6) .Submenu a:nth-child(2) { top: 84.68%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(6) .Submenu a:nth-child(3) { top: 86.88%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(6) .Submenu a:nth-child(4) { top: 89.08%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(6) .Submenu a:nth-child(5) { top: 91.28%; }

#Menu.abyss-menu-art .menuitem:nth-of-type(7) .Submenu a:nth-child(1) { top: 97.01%; }
#Menu.abyss-menu-art .menuitem:nth-of-type(7) .Submenu a:nth-child(2) { top: 99.04%; height: 1.55%; }

#Menu.abyss-menu-art {
  width: 270px;
  height: auto;
  aspect-ratio: auto;
  background: transparent;
}

#Menu.abyss-menu-art .menuitem {
  position: relative;
  display: block !important;
  width: 270px;
  margin: 0 auto .5cm;
  overflow: hidden;
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 270px auto;
  transition: height .14s ease;
}

#Menu.abyss-menu-art .menuitem + .menuitem {
  border-top: 0;
}

#Menu.abyss-menu-art .menuitem:last-child {
  margin-bottom: 0;
}

#Menu.abyss-menu-art .menuitem:nth-of-type(1) {
  height: 125px;
  background-image: url("images/abyssal/menu-sections/news.png");
}

#Menu.abyss-menu-art .menuitem:nth-of-type(2) {
  height: 184px;
  background-image: url("images/abyssal/menu-sections/account.png");
}

#Menu.abyss-menu-art .menuitem:nth-of-type(3) {
  height: 276px;
  background-image: url("images/abyssal/menu-sections/community.png");
}

#Menu.abyss-menu-art .menuitem:nth-of-type(4) {
  height: 68px;
  background-image: url("images/abyssal/menu-sections/forum.png");
}

#Menu.abyss-menu-art .menuitem:nth-of-type(5) {
  height: 184px;
  background-image: url("images/abyssal/menu-sections/library.png");
}

#Menu.abyss-menu-art .menuitem:nth-of-type(6) {
  height: 43px;
  background-image: url("images/abyssal/menu-sections/shops.png");
}

#Menu.abyss-menu-art .menuitem.is-collapsed {
  height: 36px;
}

#Menu.abyss-menu-art .MenuButton {
  left: 0;
  right: 0;
  top: 0 !important;
  height: 36px;
  cursor: pointer;
  opacity: 1;
  background: transparent !important;
  z-index: 5;
}

#Menu.abyss-menu-art .MenuButton:hover,
#Menu.abyss-menu-art .MenuButton:focus-visible {
  outline: 0;
}

#Menu.abyss-menu-art .MenuButton:hover::before,
#Menu.abyss-menu-art .MenuButton:focus-visible::before {
  content: "";
  display: block !important;
  position: absolute;
  left: 20px;
  right: 20px;
  top: 4px;
  height: 28px;
  border-radius: 2px;
  background: linear-gradient(180deg, rgba(105, 205, 255, .24), rgba(30, 123, 190, .22));
  box-shadow:
    inset 0 0 0 1px rgba(144, 224, 255, .18),
    inset 0 0 14px rgba(105, 205, 255, .20);
}

#Menu.abyss-menu-art .Submenu {
  display: block;
}

#Menu.abyss-menu-art .menuitem.is-collapsed .Submenu {
  display: none !important;
}

#Menu.abyss-menu-art .Submenu a {
  left: 28px;
  right: 20px;
  height: 18px;
  cursor: pointer;
  z-index: 6;
}

#Menu.abyss-menu-art .menuitem:nth-of-type(1) .Submenu a:nth-child(1) { top: 49px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(1) .Submenu a:nth-child(2) { top: 72px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(1) .Submenu a:nth-child(3) { top: 95px; }

#Menu.abyss-menu-art .menuitem:nth-of-type(2) .Submenu a:nth-child(1) { top: 37px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(2) .Submenu a:nth-child(2) { top: 61px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(2) .Submenu a:nth-child(3) { top: 85px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(2) .Submenu a:nth-child(4) { top: 108px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(2) .Submenu a:nth-child(5) { top: 132px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(2) .Submenu a:nth-child(6) { top: 156px; }

#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(1) { top: 39px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(2) { top: 63px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(3) { top: 87px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(4) { top: 110px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(5) { top: 134px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(6) { top: 158px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(7) { top: 182px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(8) { top: 205px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(9) { top: 229px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(10) { top: 253px; }

#Menu.abyss-menu-art .menuitem:nth-of-type(4) .Submenu a:nth-child(1) { top: 40px; }

#Menu.abyss-menu-art .menuitem:nth-of-type(5) .Submenu a:nth-child(1) { top: 40px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(5) .Submenu a:nth-child(2) { top: 64px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(5) .Submenu a:nth-child(3) { top: 88px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(5) .Submenu a:nth-child(4) { top: 111px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(5) .Submenu a:nth-child(5) { top: 135px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(5) .Submenu a:nth-child(6) { top: 159px; }

#Menu.abyss-menu-art .menuitem:nth-of-type(6) .Submenu a:nth-child(1) { top: 40px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(6) .Submenu a:nth-child(2) { top: 64px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(6) .Submenu a:nth-child(3) { top: 88px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(6) .Submenu a:nth-child(4) { top: 112px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(6) .Submenu a:nth-child(5) { top: 136px; }

#Menu.abyss-menu-art .menuitem:nth-of-type(7) .Submenu a:nth-child(1) { top: 31px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(7) .Submenu a:nth-child(2) { top: 54px; }

#Menu.abyss-menu-art .Submenu a:hover,
#Menu.abyss-menu-art .Submenu a:focus-visible {
  outline: 0;
  background: linear-gradient(180deg, rgba(89, 196, 255, .34), rgba(21, 111, 174, .30));
  box-shadow:
    inset 0 0 0 1px rgba(139, 223, 255, .26),
    inset 0 0 13px rgba(89, 196, 255, .26);
}

#Menu.abyss-menu-art {
  position: relative;
  width: 270px;
  height: auto;
  margin: 4px auto 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}

#Menu.abyss-menu-art .menuitem {
  position: relative;
  display: block !important;
  width: 270px;
  margin: 0 auto .2cm;
  overflow: hidden;
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 270px auto;
  transition: height .14s ease;
}

#Menu.abyss-menu-art .menuitem:last-child {
  margin-bottom: 0;
}

#Menu.abyss-menu-art .menuitem:nth-of-type(1) { height: 156px; background-image: url("images/abyssal/menu-sections/news.png?v=20260527-menumenu"); }
#Menu.abyss-menu-art .menuitem:nth-of-type(2) { height: 214px; background-image: url("images/abyssal/menu-sections/account.png?v=20260527-menumenu"); }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) { height: 290px; background-image: url("images/abyssal/menu-sections/community.png?v=20260527-menumenu"); }
#Menu.abyss-menu-art .menuitem:nth-of-type(4) { height: 94px; background-image: url("images/abyssal/menu-sections/forum.png?v=20260527-menumenu"); }
#Menu.abyss-menu-art .menuitem:nth-of-type(5) { height: 198px; background-image: url("images/abyssal/menu-sections/library.png?v=20260527-menumenu"); }
#Menu.abyss-menu-art .menuitem:nth-of-type(6) { height: 118px; background-image: url("images/abyssal/menu-sections/shops.png?v=20260527-menumenu"); }

#Menu.abyss-menu-art .menuitem.is-collapsed {
  height: 66px;
}

#Menu.abyss-menu-art .MenuButton {
  position: absolute;
  left: 0;
  right: 0;
  top: 0 !important;
  z-index: 20;
  height: 66px;
  min-height: 0;
  padding: 0;
  border: 0;
  cursor: pointer;
  opacity: 1;
  background: transparent !important;
}

#Menu.abyss-menu-art .SubmenuitemLabel::before {
  display: none !important;
}

#Menu.abyss-menu-art .MenuButton::after {
  display: none !important;
}

#Menu.abyss-menu-art .MenuButton:hover::before,
#Menu.abyss-menu-art .MenuButton:focus-visible::before {
  content: "";
  display: block !important;
  position: absolute;
  left: 20px;
  right: 20px;
  top: 4px;
  z-index: 1;
  height: 28px;
  border-radius: 2px;
  background:
    linear-gradient(180deg, rgba(105, 205, 255, .34), rgba(30, 123, 190, .30)),
    linear-gradient(90deg, rgba(3, 16, 30, .80), rgba(4, 23, 41, 1) 10%, rgba(4, 23, 41, 1) 90%, rgba(3, 16, 30, .80));
  box-shadow:
    inset 0 0 0 1px rgba(144, 224, 255, .18),
    inset 0 0 14px rgba(105, 205, 255, .20);
}

#Menu.abyss-menu-art .Submenu {
  display: block;
}

#Menu.abyss-menu-art .menuitem.is-collapsed .Submenu {
  display: none !important;
}

#Menu.abyss-menu-art .Submenu a {
  position: absolute;
  left: 28px;
  right: 20px;
  z-index: 30;
  height: 18px;
  display: block;
  border-radius: 2px;
  color: transparent !important;
  overflow: hidden;
  cursor: pointer;
}

#Menu.abyss-menu-art .Submenuitem,
#Menu.abyss-menu-art .SubmenuitemLabel {
  min-height: 0;
  height: 100%;
  padding: 0;
  border: 0;
  background: transparent !important;
  color: transparent !important;
  font-size: 0;
}

#Menu.abyss-menu-art .Submenu a:hover,
#Menu.abyss-menu-art .Submenu a:focus-visible {
  outline: 0;
  background: linear-gradient(180deg, rgba(89, 196, 255, .34), rgba(21, 111, 174, .30));
  box-shadow:
    inset 0 0 0 1px rgba(139, 223, 255, .26),
    inset 0 0 13px rgba(89, 196, 255, .26);
}

#Menu.abyss-menu-art .menuitem:nth-of-type(1) .Submenu a:nth-child(1) { top: 81px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(1) .Submenu a:nth-child(2) { top: 104px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(1) .Submenu a:nth-child(3) { top: 127px; }

#Menu.abyss-menu-art .menuitem:nth-of-type(2) .Submenu a:nth-child(1) { top: 68px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(2) .Submenu a:nth-child(2) { top: 92px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(2) .Submenu a:nth-child(3) { top: 116px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(2) .Submenu a:nth-child(4) { top: 139px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(2) .Submenu a:nth-child(5) { top: 163px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(2) .Submenu a:nth-child(6) { top: 187px; }

#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(1) { top: 65px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(2) { top: 88px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(3) { top: 110px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(4) { top: 132px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(5) { top: 155px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(6) { top: 177px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(7) { top: 200px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(8) { top: 222px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(9) { top: 244px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) .Submenu a:nth-child(10) { top: 267px; }

#Menu.abyss-menu-art .menuitem:nth-of-type(4) .Submenu a:nth-child(1) { top: 65px; }

#Menu.abyss-menu-art .menuitem:nth-of-type(5) .Submenu a:nth-child(1) { top: 65px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(5) .Submenu a:nth-child(2) { top: 89px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(5) .Submenu a:nth-child(3) { top: 110px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(5) .Submenu a:nth-child(4) { top: 131px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(5) .Submenu a:nth-child(5) { top: 152px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(5) .Submenu a:nth-child(6) { top: 173px; }

#Menu.abyss-menu-art .menuitem:nth-of-type(6) .Submenu a:nth-child(1) { top: 65px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(6) .Submenu a:nth-child(2) { top: 88px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(6) .Submenu a:nth-child(3) { top: 108px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(6) .Submenu a:nth-child(4) { top: 129px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(6) .Submenu a:nth-child(5) { top: 151px; }

#Menu.abyss-menu-art .menuitem:nth-of-type(7) .Submenu a:nth-child(1) { top: 65px; }
#Menu.abyss-menu-art .menuitem:nth-of-type(7) .Submenu a:nth-child(2) { top: 90px; height: 18px; }

/* Abyssal menu audit: final source of truth for the left menu artwork. */
#Menu.abyss-menu-art {
  position: relative !important;
  width: 426px !important;
  max-width: 350px;
  height: auto !important;
  margin: 4px auto 0 !important;
  padding: 0 !important;
  background: transparent !important;
  overflow: visible !important;
}

#Menu.abyss-menu-art .menuitem {
  position: relative !important;
  display: block !important;
  width: 350px !important;
  margin: 0 auto 7px !important;
  overflow: hidden !important;
  background-position: center top !important;
  background-repeat: no-repeat !important;
  background-size: 350px auto !important;
  transition: height .16s ease;
}

#Menu.abyss-menu-art .menuitem:last-child {
  margin-bottom: 0 !important;
}

#Menu.abyss-menu-art .menuitem:nth-of-type(1) { height: 146px !important; background-image: url("images/abyssal/menu-sections/news.png?v=20260528-css-submenus") !important; }
#Menu.abyss-menu-art .menuitem:nth-of-type(2) { height: 218px !important; background-image: url("images/abyssal/menu-sections/account.png?v=20260528-css-submenus") !important; }
#Menu.abyss-menu-art .menuitem:nth-of-type(3) { height: 314px !important; background-image: url("images/abyssal/menu-sections/community.png?v=20260528-css-submenus") !important; }
#Menu.abyss-menu-art .menuitem:nth-of-type(4) { height: 218px !important; background-image: url("images/abyssal/menu-sections/library.png?v=20260528-css-submenus") !important; }
#Menu.abyss-menu-art .menuitem:nth-of-type(5) { height: 122px !important; background-image: url("images/abyssal/menu-sections/shops.png?v=20260528-css-submenus") !important; }

#Menu.abyss-menu-art .menuitem.is-collapsed {
  height: 70px !important;
}

#Menu.abyss-menu-art .MenuButton {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  z-index: 40 !important;
  height: 70px !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 1 !important;
  cursor: pointer !important;
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
}

#Menu.abyss-menu-art .MenuButton > div,
#Menu.abyss-menu-art .MenuButton .Button,
#Menu.abyss-menu-art .MenuButton .Icon,
#Menu.abyss-menu-art .MenuButton .Label,
#Menu.abyss-menu-art .MenuButton .Lights,
#Menu.abyss-menu-art .MenuButton .Extend,
#Menu.abyss-menu-art .MenuButton::before,
#Menu.abyss-menu-art .MenuButton::after,
#Menu.abyss-menu-art .SubmenuitemLabel::before {
  display: none !important;
  content: none !important;
}

#Menu.abyss-menu-art .MenuButton:hover,
#Menu.abyss-menu-art .MenuButton:focus,
#Menu.abyss-menu-art .MenuButton:focus-visible {
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  outline: 0 !important;
}

#Menu.abyss-menu-art .MenuButton:hover::before,
#Menu.abyss-menu-art .MenuButton:focus::before,
#Menu.abyss-menu-art .MenuButton:focus-visible::before,
#Menu.abyss-menu-art .MenuButton:hover::after,
#Menu.abyss-menu-art .MenuButton:focus::after,
#Menu.abyss-menu-art .MenuButton:focus-visible::after {
  display: none !important;
  content: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

#Menu.abyss-menu-art .Submenu {
  display: block !important;
  position: relative !important;
  z-index: 25 !important;
  width: 248px !important;
  margin: 68px auto 0 !important;
  transform: translateX(-0.3cm) !important;
  padding: 1px 0 2px !important;
  border: 1px solid rgba(238, 177, 43, .98) !important;
  border-top-color: rgba(255, 215, 91, .98) !important;
  border-bottom-color: rgba(181, 112, 19, .98) !important;
  background:
    linear-gradient(90deg, rgba(252, 189, 42, .92), rgba(252, 189, 42, .34) 2px, transparent 2px, transparent calc(100% - 2px), rgba(252, 189, 42, .34) calc(100% - 2px), rgba(252, 189, 42, .92)),
    linear-gradient(180deg, rgba(7, 31, 53, .97), rgba(5, 21, 36, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 238, 144, .58),
    inset 0 -1px 0 rgba(92, 49, 9, .95),
    0 0 0 1px rgba(31, 12, 0, .68),
    0 0 10px rgba(0, 142, 255, .25),
    0 0 10px rgba(255, 175, 35, .18) !important;
}

#Menu.abyss-menu-art .menuitem.is-collapsed .Submenu {
  display: none !important;
}

#Menu.abyss-menu-art .Submenu a {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 30 !important;
  height: 24px !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  border-radius: 0 !important;
  color: #fff4c7 !important;
  overflow: hidden !important;
  cursor: pointer !important;
  text-decoration: none !important;
  background:
    linear-gradient(90deg, rgba(8, 31, 50, .94), rgba(12, 51, 82, .90) 50%, rgba(5, 22, 38, .96)),
    linear-gradient(180deg, rgba(15, 57, 91, .84), rgba(5, 20, 34, .90)) !important;
  box-shadow:
    inset 0 -1px 0 rgba(225, 154, 34, .86),
    inset 0 1px 0 rgba(255, 221, 97, .22) !important;
  transition: background .15s ease, box-shadow .15s ease, filter .15s ease;
}

#Menu.abyss-menu-art .Submenu a:link,
#Menu.abyss-menu-art .Submenu a:visited,
#Menu.abyss-menu-art .Submenu a:hover,
#Menu.abyss-menu-art .Submenu a:focus {
  color: #fff4c7 !important;
}

#Menu.abyss-menu-art .Submenuitem,
#Menu.abyss-menu-art .SubmenuitemLabel {
  position: static !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  min-height: 0 !important;
  height: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  font-size: 13px !important;
  line-height: 24px !important;
}

#Menu.abyss-menu-art .Submenuitem {
  color: #fff4c7 !important;
}

#Menu.abyss-menu-art .SubmenuitemLabel {
  position: relative !important;
  display: block !important;
  padding: 0 8px 0 35px !important;
  color: inherit !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  text-shadow: 1px 1px 1px #000, 0 0 5px rgba(0, 0, 0, .95) !important;
  transition: color .15s ease, text-shadow .15s ease;
}

#Menu.abyss-menu-art #submenu_guildwars,
#Menu.abyss-menu-art #submenu_roulette,
#Menu.abyss-menu-art #submenu_points {
  color: #1dff50 !important;
}

#Menu.abyss-menu-art .SubmenuitemLabel::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 12px !important;
  top: 7px !important;
  width: 9px !important;
  height: 9px !important;
  border: 1px solid rgba(220, 154, 34, .96) !important;
  background: linear-gradient(135deg, #082944, #0b86db 48%, #03182a 52%, #094978) !important;
  box-shadow:
    0 0 0 1px rgba(1, 8, 14, .82),
    0 0 5px rgba(0, 169, 255, .72) !important;
  transform: rotate(45deg) !important;
  transition: border-color .15s ease, box-shadow .15s ease, filter .15s ease;
}

/* Menu sections are keyed by id so removing Forum cannot shift click targets. */
#Menu.abyss-menu-art #news {
  height: 146px !important;
  background-image: url("images/abyssal/menu-sections/news.png?v=20260528-css-submenus") !important;
}

#Menu.abyss-menu-art #account {
  height: 218px !important;
  background-image: url("images/abyssal/menu-sections/account.png?v=20260528-css-submenus") !important;
}

#Menu.abyss-menu-art #community {
  height: 314px !important;
  background-image: url("images/abyssal/menu-sections/community.png?v=20260528-css-submenus") !important;
}

#Menu.abyss-menu-art #library {
  height: 218px !important;
  background-image: url("images/abyssal/menu-sections/library.png?v=20260528-css-submenus") !important;
}

#Menu.abyss-menu-art #shops {
  height: 122px !important;
  background-image: url("images/abyssal/menu-sections/shops.png?v=20260528-css-submenus") !important;
}

#Menu.abyss-menu-art #forum {
  display: none !important;
}

#Menu.abyss-menu-art .menuitem.is-collapsed,
#Menu.abyss-menu-art #news.is-collapsed,
#Menu.abyss-menu-art #account.is-collapsed,
#Menu.abyss-menu-art #community.is-collapsed,
#Menu.abyss-menu-art #library.is-collapsed,
#Menu.abyss-menu-art #shops.is-collapsed {
  height: 70px !important;
}

#Menu.abyss-menu-art .menuitem.is-collapsed .Submenu {
  display: none !important;
}

#Menu.abyss-menu-art .Submenu a:hover,
#Menu.abyss-menu-art .Submenu a:focus-visible {
  outline: 0 !important;
  background:
    linear-gradient(90deg, rgba(16, 69, 107, .94), rgba(24, 116, 177, .92) 52%, rgba(6, 40, 70, .96)),
    linear-gradient(180deg, rgba(89, 196, 255, .72), rgba(7, 82, 141, .78)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(180, 236, 255, .66),
    inset 0 0 16px rgba(83, 196, 255, .62),
    inset 0 -1px 0 rgba(255, 205, 68, .92),
    0 0 12px rgba(0, 167, 255, .46),
    0 0 8px rgba(255, 184, 40, .22) !important;
}

#Menu.abyss-menu-art .Submenu a:hover .SubmenuitemLabel,
#Menu.abyss-menu-art .Submenu a:focus-visible .SubmenuitemLabel {
  color: #fff9d7 !important;
  text-shadow:
    1px 1px 1px #000,
    0 0 7px rgba(0, 180, 255, .78),
    0 0 5px rgba(255, 194, 56, .42) !important;
}

#Menu.abyss-menu-art .Submenu a:hover .SubmenuitemLabel::before,
#Menu.abyss-menu-art .Submenu a:focus-visible .SubmenuitemLabel::before {
  border-color: rgba(255, 218, 87, .98) !important;
  filter: brightness(1.2) saturate(1.16);
  box-shadow:
    0 0 0 1px rgba(38, 15, 0, .9),
    0 0 8px rgba(0, 190, 255, .86),
    0 0 7px rgba(255, 191, 42, .46) !important;
}

#Menu.abyss-menu-art .Submenuitem.is-active {
  background:
    linear-gradient(90deg, rgba(60, 32, 5, .32), rgba(32, 99, 136, .70) 42%, rgba(119, 75, 13, .45)),
    linear-gradient(180deg, rgba(21, 86, 128, .88), rgba(7, 45, 76, .92)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 219, 91, .82),
    inset 3px 0 0 rgba(255, 189, 43, .92),
    inset 0 0 16px rgba(54, 176, 255, .54),
    0 0 10px rgba(255, 181, 37, .34) !important;
}

#Menu.abyss-menu-art .Submenuitem.is-active .SubmenuitemLabel {
  color: #fff7c9 !important;
  text-shadow:
    1px 1px 1px #000,
    0 0 8px rgba(255, 193, 48, .62),
    0 0 9px rgba(0, 181, 255, .58) !important;
}

#Menu.abyss-menu-art .Submenuitem.is-active .SubmenuitemLabel::before {
  border-color: rgba(255, 223, 94, .98) !important;
  background: linear-gradient(135deg, #103a57, #20b7ff 48%, #062033 52%, #0b6098) !important;
  box-shadow:
    0 0 0 1px rgba(48, 17, 0, .9),
    0 0 8px rgba(255, 189, 39, .74),
    0 0 8px rgba(0, 185, 255, .78) !important;
}

/* Abyssal premium left navigation, HTML/CSS source of truth. */
#MenuColumn {
  --abyss-nav-blue-0: #020812;
  --abyss-nav-blue-1: #061c32;
  --abyss-nav-blue-2: #0a355b;
  --abyss-nav-cyan: #18b8ff;
  --abyss-nav-cyan-soft: rgba(24, 184, 255, .46);
  --abyss-nav-gold: #d7a53f;
  --abyss-nav-gold-2: #ffe8a6;
  --abyss-nav-bronze: #7b4a1b;
  --abyss-nav-ink: rgba(0, 0, 0, .62);
}

.abyss-login-mini,
.abyss-download-art,
#Menu.abyss-menu-art .menuitem {
  isolation: isolate;
}

.abyss-login-mini {
  width: 332px !important;
  max-width: calc(100% + 6px);
  aspect-ratio: auto !important;
  min-height: 0 !important;
  margin: 0 auto 12px !important;
  padding: 18px 18px 16px !important;
  border: 1px solid rgba(255, 216, 109, .92) !important;
  border-radius: 8px !important;
  background:
    radial-gradient(circle at 50% 0, rgba(34, 184, 255, .34), transparent 86px),
    linear-gradient(135deg, transparent 0 14px, rgba(225, 170, 62, .42) 15px 16px, transparent 17px),
    linear-gradient(225deg, transparent 0 14px, rgba(225, 170, 62, .42) 15px 16px, transparent 17px),
    linear-gradient(315deg, transparent 0 14px, rgba(225, 170, 62, .42) 15px 16px, transparent 17px),
    linear-gradient(45deg, transparent 0 14px, rgba(225, 170, 62, .42) 15px 16px, transparent 17px),
    linear-gradient(180deg, rgba(11, 42, 70, .98), rgba(3, 11, 21, .99) 56%, rgba(7, 28, 48, .98)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 239, 175, .22),
    inset 0 0 34px rgba(0, 163, 255, .18),
    0 0 0 1px rgba(35, 13, 0, .84),
    0 16px 30px rgba(0, 0, 0, .48),
    0 0 26px rgba(0, 142, 255, .18) !important;
  overflow: visible !important;
  transform: none !important;
}

.abyss-login-mini::before,
.abyss-login-mini::after,
.abyss-download-art::before,
.abyss-download-art::after,
#Menu.abyss-menu-art .menuitem::before,
#Menu.abyss-menu-art .menuitem::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.abyss-login-mini::before,
#Menu.abyss-menu-art .menuitem::before {
  inset: 6px;
  z-index: -1;
  border: 1px solid rgba(255, 226, 130, .34);
  border-radius: 5px;
  box-shadow:
    inset 0 0 0 1px rgba(0, 184, 255, .10),
    inset 0 0 26px rgba(0, 0, 0, .44);
}

.abyss-login-mini::after {
  left: 24px;
  right: 24px;
  top: -7px;
  height: 18px;
  background:
    radial-gradient(circle, rgba(255, 239, 158, .95) 0 2px, transparent 3px),
    linear-gradient(90deg, transparent, rgba(255, 203, 74, .74), transparent);
  filter: drop-shadow(0 0 8px rgba(255, 197, 58, .58));
}

.abyss-mini-logo {
  display: block !important;
  margin: 0 0 12px !important;
  color: #fff4c7 !important;
  font-family: Cinzel, Georgia, serif !important;
  font-size: 22px !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-shadow:
    0 1px 0 #000,
    0 0 12px rgba(27, 184, 255, .78),
    0 0 9px rgba(255, 197, 58, .36) !important;
}

.abyss-mini-logo::before,
.abyss-mini-logo::after {
  content: "";
  display: inline-block;
  width: 22px;
  height: 1px;
  margin: 0 8px 6px;
  background: linear-gradient(90deg, transparent, rgba(255, 211, 91, .92), transparent);
  box-shadow: 0 0 7px rgba(255, 211, 91, .54);
}

.abyss-login-mini .fantasy-button,
.abyss-login-mini.is-logged .fantasy-button {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  width: 100% !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 0 10px !important;
  padding: 0 14px !important;
  border: 1px solid rgba(255, 218, 110, .88) !important;
  border-radius: 5px !important;
  color: #fff4c7 !important;
  font-family: Cinzel, Georgia, serif !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  line-height: 44px !important;
  letter-spacing: 0 !important;
  text-indent: 0 !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 0 #000, 0 0 9px rgba(0, 175, 255, .58) !important;
  background:
    linear-gradient(90deg, transparent, rgba(255, 226, 126, .20) 16%, transparent 30%, transparent 70%, rgba(255, 226, 126, .20) 84%, transparent),
    linear-gradient(180deg, rgba(18, 83, 130, .98), rgba(4, 22, 39, .98) 54%, rgba(8, 47, 78, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 245, 178, .36),
    inset 0 -2px 0 rgba(59, 25, 0, .82),
    inset 0 0 18px rgba(0, 163, 255, .28),
    0 8px 14px rgba(0, 0, 0, .40),
    0 0 12px rgba(215, 165, 63, .20) !important;
  overflow: hidden !important;
  transition: transform .16s ease, filter .16s ease, box-shadow .16s ease, border-color .16s ease !important;
}

.abyss-login-mini .fantasy-button:last-child {
  margin-bottom: 0 !important;
}

.abyss-login-mini .fantasy-button::before,
.abyss-download-art::before {
  content: "";
  position: absolute;
  inset: 4px 9px;
  border: 1px solid rgba(255, 231, 142, .22);
  border-radius: 3px;
  pointer-events: none;
}

.abyss-login-mini .fantasy-button::after,
.abyss-download-art::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(110deg, transparent 0 38%, rgba(255, 255, 255, .18) 48%, transparent 58%);
  transform: translateX(-120%);
  transition: transform .22s ease;
}

.abyss-login-mini .fantasy-button:hover,
.abyss-login-mini .fantasy-button:focus-visible,
.abyss-download-art:hover,
.abyss-download-art:focus-visible {
  border-color: rgba(255, 237, 151, .98) !important;
  filter: brightness(1.12) saturate(1.12);
  transform: translateY(-1px) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 248, 190, .46),
    inset 0 -2px 0 rgba(75, 32, 0, .88),
    inset 0 0 22px rgba(0, 184, 255, .42),
    0 10px 17px rgba(0, 0, 0, .46),
    0 0 18px rgba(24, 184, 255, .44),
    0 0 16px rgba(255, 196, 57, .28) !important;
  outline: 0 !important;
}

.abyss-login-mini .fantasy-button:hover::after,
.abyss-login-mini .fantasy-button:focus-visible::after,
.abyss-download-art:hover::after,
.abyss-download-art:focus-visible::after {
  transform: translateX(120%);
}

.abyss-login-mini .fantasy-button:active,
.abyss-download-art:active {
  transform: translateY(1px) !important;
  filter: brightness(.96);
}

.abyss-login-mini__secondary {
  background:
    linear-gradient(90deg, transparent, rgba(255, 226, 126, .14) 18%, transparent 32%, transparent 68%, rgba(255, 226, 126, .14) 82%, transparent),
    linear-gradient(180deg, rgba(120, 70, 21, .98), rgba(42, 21, 6, .98) 56%, rgba(93, 51, 14, .98)) !important;
}

.abyss-login-mini.is-logged .abyss-login-mini__secondary {
  background:
    linear-gradient(90deg, transparent, rgba(255, 226, 126, .12) 18%, transparent 32%, transparent 68%, rgba(255, 226, 126, .12) 82%, transparent),
    linear-gradient(180deg, rgba(146, 37, 31, .98), rgba(57, 10, 12, .98) 56%, rgba(104, 20, 17, .98)) !important;
}

.abyss-download-art {
  position: relative;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 332px !important;
  max-width: calc(100% + 6px);
  aspect-ratio: auto !important;
  min-height: 58px !important;
  margin: 0 auto 14px !important;
  border: 1px solid rgba(255, 218, 110, .92) !important;
  border-radius: 7px !important;
  color: #fff4c7 !important;
  font-family: Cinzel, Georgia, serif !important;
  font-size: 17px !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  text-shadow: 0 1px 0 #000, 0 0 11px rgba(24, 184, 255, .78) !important;
  background:
    radial-gradient(circle at 50% 0, rgba(24, 184, 255, .32), transparent 70%),
    linear-gradient(90deg, rgba(106, 62, 18, .85), transparent 18%, transparent 82%, rgba(106, 62, 18, .85)),
    linear-gradient(180deg, rgba(24, 83, 126, .98), rgba(5, 20, 36, .99) 58%, rgba(8, 44, 73, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 245, 178, .38),
    inset 0 -2px 0 rgba(57, 24, 0, .86),
    inset 0 0 24px rgba(0, 164, 255, .24),
    0 12px 22px rgba(0, 0, 0, .46) !important;
  filter: none !important;
  transform: none !important;
  overflow: hidden;
}

.abyss-download-art::before {
  content: "Download";
  inset: auto;
  position: static;
  border: 0;
}

.abyss-download-art::after {
  content: "";
  position: absolute;
}

#Menu.abyss-menu-art {
  width: 332px !important;
  max-width: calc(100% + 6px) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

#Menu.abyss-menu-art .menuitem,
#Menu.abyss-menu-art #news,
#Menu.abyss-menu-art #account,
#Menu.abyss-menu-art #community,
#Menu.abyss-menu-art #library,
#Menu.abyss-menu-art #shops {
  position: relative !important;
  display: block !important;
  width: 332px !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 auto 12px !important;
  padding: 0 12px 12px !important;
  border: 1px solid rgba(216, 165, 63, .92) !important;
  border-radius: 8px !important;
  background-image: none !important;
  background:
    radial-gradient(circle at 50% 0, rgba(24, 184, 255, .20), transparent 92px),
    linear-gradient(90deg, rgba(128, 76, 27, .42), transparent 14%, transparent 86%, rgba(128, 76, 27, .42)),
    linear-gradient(180deg, rgba(8, 31, 53, .98), rgba(3, 12, 23, .99) 54%, rgba(6, 27, 47, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 236, 159, .34),
    inset 0 0 28px rgba(0, 142, 255, .12),
    0 0 0 1px rgba(31, 12, 0, .72),
    0 13px 24px rgba(0, 0, 0, .44) !important;
  overflow: visible !important;
  transition: filter .16s ease, box-shadow .16s ease !important;
}

#Menu.abyss-menu-art .menuitem:last-child {
  margin-bottom: 0 !important;
}

#Menu.abyss-menu-art .menuitem::after {
  left: 15px;
  right: 15px;
  bottom: 5px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 211, 91, .62), rgba(24, 184, 255, .34), rgba(255, 211, 91, .62), transparent);
}

#Menu.abyss-menu-art .menuitem.is-collapsed,
#Menu.abyss-menu-art #news.is-collapsed,
#Menu.abyss-menu-art #account.is-collapsed,
#Menu.abyss-menu-art #community.is-collapsed,
#Menu.abyss-menu-art #library.is-collapsed,
#Menu.abyss-menu-art #shops.is-collapsed {
  height: auto !important;
  padding-bottom: 0 !important;
}

#Menu.abyss-menu-art .MenuButton {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  width: calc(100% + 24px) !important;
  height: 54px !important;
  min-height: 54px !important;
  margin: 0 -12px 10px !important;
  padding: 0 42px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255, 215, 91, .38) !important;
  border-radius: 7px 7px 0 0 !important;
  opacity: 1 !important;
  cursor: pointer !important;
  background:
    linear-gradient(90deg, rgba(113, 65, 20, .72), transparent 16%, transparent 84%, rgba(113, 65, 20, .72)),
    linear-gradient(180deg, rgba(87, 16, 16, .98), rgba(45, 7, 10, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 232, 166, .36),
    inset 0 -1px 0 rgba(28, 5, 2, .92),
    0 6px 12px rgba(0, 0, 0, .26) !important;
  filter: none !important;
  overflow: hidden !important;
}

#Menu.abyss-menu-art .MenuButton > div,
#Menu.abyss-menu-art .MenuButton .Button,
#Menu.abyss-menu-art .MenuButton .Icon,
#Menu.abyss-menu-art .MenuButton .Label,
#Menu.abyss-menu-art .MenuButton .Lights,
#Menu.abyss-menu-art .MenuButton .Extend {
  display: none !important;
}

#Menu.abyss-menu-art .MenuButton::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 16px !important;
  right: 16px !important;
  top: 50% !important;
  z-index: 1 !important;
  height: 33px !important;
  border: 1px solid rgba(255, 223, 126, .50) !important;
  border-radius: 4px !important;
  background:
    radial-gradient(circle at 50% 50%, rgba(24, 184, 255, .18), transparent 62%),
    linear-gradient(90deg, transparent, rgba(255, 214, 97, .18), transparent) !important;
  box-shadow:
    inset 0 0 14px rgba(0, 0, 0, .42),
    0 0 10px rgba(255, 193, 48, .14) !important;
}

#Menu.abyss-menu-art .MenuButton::after {
  content: attr(data-title) !important;
  display: block !important;
  position: relative !important;
  z-index: 2 !important;
  min-height: 0 !important;
  padding: 0 !important;
  color: #fff4c7 !important;
  font-family: Cinzel, Georgia, serif !important;
  font-size: 17px !important;
  font-weight: 900 !important;
  line-height: 54px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-transform: uppercase !important;
  text-shadow:
    0 1px 0 #000,
    0 0 9px rgba(255, 193, 48, .44),
    0 0 10px rgba(24, 184, 255, .40) !important;
}

#Menu.abyss-menu-art .MenuButton:hover,
#Menu.abyss-menu-art .MenuButton:focus-visible {
  background:
    linear-gradient(90deg, rgba(130, 83, 25, .86), transparent 16%, transparent 84%, rgba(130, 83, 25, .86)),
    linear-gradient(180deg, rgba(116, 22, 18, .99), rgba(58, 8, 10, .99)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 236, 171, .46),
    inset 0 -1px 0 rgba(28, 5, 2, .92),
    0 0 14px rgba(24, 184, 255, .26),
    0 7px 13px rgba(0, 0, 0, .30) !important;
}

#Menu.abyss-menu-art .Submenu {
  display: grid !important;
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  margin: 0 !important;
  transform: none !important;
  gap: 5px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#Menu.abyss-menu-art .menuitem.is-collapsed .Submenu {
  display: none !important;
}

#Menu.abyss-menu-art .Submenu a {
  position: relative !important;
  inset: auto !important;
  display: block !important;
  width: 100% !important;
  height: 28px !important;
  min-height: 28px !important;
  border: 1px solid rgba(138, 84, 27, .72) !important;
  border-radius: 4px !important;
  color: #fff4c7 !important;
  text-decoration: none !important;
  background:
    linear-gradient(90deg, rgba(12, 44, 70, .98), rgba(8, 31, 52, .98) 50%, rgba(12, 44, 70, .98)),
    linear-gradient(180deg, rgba(255, 232, 141, .08), rgba(0, 0, 0, .10)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 225, 125, .16),
    inset 0 -1px 0 rgba(0, 0, 0, .54) !important;
  overflow: hidden !important;
}

#Menu.abyss-menu-art .Submenu a::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(24, 184, 255, .18), transparent);
  opacity: 0;
  transition: opacity .16s ease;
}

#Menu.abyss-menu-art .Submenuitem,
#Menu.abyss-menu-art .SubmenuitemLabel {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: inherit !important;
  font-size: 13px !important;
  line-height: 28px !important;
}

#Menu.abyss-menu-art .SubmenuitemLabel {
  padding: 0 10px 0 34px !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  text-shadow: 1px 1px 1px #000, 0 0 5px rgba(0, 0, 0, .95) !important;
}

#Menu.abyss-menu-art .SubmenuitemLabel::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 12px !important;
  top: 9px !important;
  width: 8px !important;
  height: 8px !important;
  border: 1px solid rgba(222, 166, 58, .96) !important;
  background: linear-gradient(135deg, #082944, #18b8ff 48%, #03182a 52%, #0b6098) !important;
  box-shadow:
    0 0 0 1px rgba(1, 8, 14, .82),
    0 0 5px rgba(0, 169, 255, .72) !important;
  transform: translateY(-50%) rotate(45deg) !important;
}

#Menu.abyss-menu-art .Submenu a:hover,
#Menu.abyss-menu-art .Submenu a:focus-visible {
  border-color: rgba(255, 218, 96, .92) !important;
  background:
    linear-gradient(90deg, rgba(16, 71, 109, .99), rgba(23, 105, 157, .98) 50%, rgba(10, 45, 77, .99)),
    linear-gradient(180deg, rgba(255, 232, 141, .16), rgba(0, 0, 0, .10)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(161, 226, 255, .34),
    inset 0 0 15px rgba(24, 184, 255, .36),
    0 0 11px rgba(24, 184, 255, .30),
    0 0 8px rgba(255, 190, 45, .18) !important;
}

#Menu.abyss-menu-art .Submenu a:hover::before,
#Menu.abyss-menu-art .Submenu a:focus-visible::before {
  opacity: 1;
}

#Menu.abyss-menu-art .Submenu a:hover .SubmenuitemLabel,
#Menu.abyss-menu-art .Submenu a:focus-visible .SubmenuitemLabel,
#Menu.abyss-menu-art .Submenuitem.is-active .SubmenuitemLabel {
  color: #fff9d7 !important;
  text-shadow:
    1px 1px 1px #000,
    0 0 8px rgba(24, 184, 255, .76),
    0 0 5px rgba(255, 194, 56, .48) !important;
}

#Menu.abyss-menu-art .Submenuitem.is-active {
  background:
    linear-gradient(90deg, rgba(70, 37, 8, .50), rgba(31, 111, 157, .66) 50%, rgba(70, 37, 8, .50)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 219, 91, .72),
    inset 3px 0 0 rgba(255, 189, 43, .92),
    inset 0 0 14px rgba(24, 184, 255, .40) !important;
}

#Menu.abyss-menu-art #submenu_guildwars,
#Menu.abyss-menu-art #submenu_roulette,
#Menu.abyss-menu-art #submenu_points {
  color: #83ff98 !important;
}

/* Abyssal menu polish pass: align tones with content headers and Server Save. */
#MenuColumn {
  --abyss-nav-red-top: rgba(126, 21, 16, .98);
  --abyss-nav-red-bottom: rgba(72, 8, 10, .98);
  --abyss-nav-blue-top: rgba(13, 55, 101, .96);
  --abyss-nav-blue-bottom: rgba(4, 17, 30, .98);
  --abyss-nav-blue-mid: rgba(17, 63, 92, .92);
  --abyss-nav-gold-line: rgba(216, 168, 75, .88);
  --abyss-nav-gold-soft: rgba(255, 226, 132, .54);
}

.abyss-login-mini,
#Menu.abyss-menu-art .menuitem,
.abyss-download-art {
  border-color: rgba(216, 168, 75, .76) !important;
  border-radius: 5px !important;
  background:
    linear-gradient(90deg, rgba(216, 168, 75, .18), transparent 18%, transparent 82%, rgba(216, 168, 75, .18)),
    linear-gradient(180deg, rgba(6, 24, 37, .96), rgba(4, 13, 23, .98) 55%, rgba(5, 21, 35, .96)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 242, 190, .16),
    inset 0 0 22px rgba(0, 0, 0, .42),
    0 0 0 1px rgba(30, 10, 0, .76),
    0 9px 18px rgba(0, 0, 0, .42) !important;
}

.abyss-login-mini {
  padding: 15px 16px 14px !important;
}

.abyss-login-mini::before,
#Menu.abyss-menu-art .menuitem::before {
  inset: 5px !important;
  border-color: rgba(216, 168, 75, .42) !important;
  border-radius: 3px !important;
  box-shadow:
    inset 0 0 0 1px rgba(0, 166, 255, .08),
    inset 0 0 18px rgba(0, 0, 0, .50) !important;
}

.abyss-login-mini::after {
  left: 24px !important;
  right: 24px !important;
  top: -5px !important;
  height: 10px !important;
  background:
    radial-gradient(circle at 50% 0, rgba(255, 242, 165, .95) 0 2px, transparent 3px),
    linear-gradient(90deg, transparent, rgba(216, 168, 75, .72), transparent) !important;
  filter: drop-shadow(0 0 5px rgba(216, 168, 75, .56)) !important;
}

.abyss-mini-logo {
  margin-bottom: 10px !important;
  color: #fff4c7 !important;
  font-size: 20px !important;
  text-shadow: 0 1px 0 #000, 0 0 7px rgba(216, 168, 75, .42) !important;
}

.abyss-login-mini .fantasy-button,
.abyss-login-mini.is-logged .fantasy-button,
.abyss-download-art {
  height: 39px !important;
  min-height: 39px !important;
  border-color: rgba(216, 168, 75, .82) !important;
  border-radius: 3px !important;
  color: #fff4c7 !important;
  background:
    linear-gradient(90deg, rgba(216, 168, 75, .22), transparent 13%, transparent 87%, rgba(216, 168, 75, .22)),
    linear-gradient(180deg, var(--abyss-nav-blue-top), var(--abyss-nav-blue-bottom)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 242, 190, .24),
    inset 0 -1px 0 rgba(0, 0, 0, .70),
    inset 0 0 14px rgba(0, 166, 255, .20),
    0 4px 8px rgba(0, 0, 0, .34) !important;
}

.abyss-login-mini .fantasy-button::before,
.abyss-download-art::before {
  inset: 4px 7px !important;
  border-color: rgba(255, 226, 132, .24) !important;
  border-radius: 2px !important;
}

.abyss-login-mini .fantasy-button:hover,
.abyss-login-mini .fantasy-button:focus-visible,
.abyss-download-art:hover,
.abyss-download-art:focus-visible {
  background:
    linear-gradient(90deg, rgba(255, 226, 132, .28), transparent 13%, transparent 87%, rgba(255, 226, 132, .28)),
    linear-gradient(180deg, rgba(17, 73, 126, .98), rgba(5, 25, 45, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 242, 190, .34),
    inset 0 -1px 0 rgba(0, 0, 0, .72),
    inset 0 0 17px rgba(0, 166, 255, .32),
    0 0 10px rgba(0, 166, 255, .34),
    0 0 8px rgba(216, 168, 75, .24),
    0 5px 9px rgba(0, 0, 0, .38) !important;
  filter: none !important;
}

.abyss-login-mini.is-logged .abyss-login-mini__secondary {
  border-color: rgba(216, 168, 75, .76) !important;
  background:
    linear-gradient(90deg, rgba(216, 168, 75, .16), transparent 13%, transparent 87%, rgba(216, 168, 75, .16)),
    linear-gradient(180deg, var(--abyss-nav-red-top), var(--abyss-nav-red-bottom)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 220, 150, .22),
    inset 0 -1px 0 rgba(0, 0, 0, .74),
    inset 0 0 13px rgba(255, 92, 58, .12),
    0 4px 8px rgba(0, 0, 0, .34) !important;
}

.abyss-login-mini.is-logged .abyss-login-mini__secondary:hover,
.abyss-login-mini.is-logged .abyss-login-mini__secondary:focus-visible {
  background:
    linear-gradient(90deg, rgba(255, 226, 132, .20), transparent 13%, transparent 87%, rgba(255, 226, 132, .20)),
    linear-gradient(180deg, rgba(141, 26, 18, .98), rgba(82, 10, 10, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 220, 150, .30),
    inset 0 -1px 0 rgba(0, 0, 0, .78),
    inset 0 0 15px rgba(255, 92, 58, .18),
    0 0 9px rgba(216, 168, 75, .26),
    0 5px 9px rgba(0, 0, 0, .38) !important;
}

.abyss-download-art {
  justify-content: center !important;
  margin-bottom: 12px !important;
  font-size: 16px !important;
  text-shadow: 0 1px 0 #000, 0 0 6px rgba(216, 168, 75, .36) !important;
}

#Menu.abyss-menu-art .menuitem,
#Menu.abyss-menu-art #news,
#Menu.abyss-menu-art #account,
#Menu.abyss-menu-art #community,
#Menu.abyss-menu-art #library,
#Menu.abyss-menu-art #shops {
  padding: 0 10px 10px !important;
}

#Menu.abyss-menu-art .menuitem::after {
  top: 9px !important;
  bottom: auto !important;
  left: 10px !important;
  right: auto !important;
  width: 15px !important;
  height: 15px !important;
  border-top: 1px solid rgba(255, 226, 132, .62);
  border-left: 1px solid rgba(255, 226, 132, .62);
  background:
    linear-gradient(135deg, rgba(255, 226, 132, .36) 0 1px, transparent 1px 100%),
    linear-gradient(135deg, rgba(126, 77, 23, .50), rgba(72, 8, 10, .10) 48%, transparent 49%) !important;
  box-shadow:
    294px 0 0 rgba(0, 0, 0, 0),
    294px 0 0 -1px rgba(255, 226, 132, .76);
}

#Menu.abyss-menu-art .MenuButton {
  width: calc(100% + 20px) !important;
  height: 49px !important;
  min-height: 49px !important;
  margin: 0 -10px 9px !important;
  border-bottom-color: rgba(216, 168, 75, .68) !important;
  border-radius: 4px 4px 0 0 !important;
  background:
    linear-gradient(90deg, rgba(126, 21, 16, .92), rgba(88, 12, 12, .98) 16%, rgba(72, 8, 10, .98) 50%, rgba(88, 12, 12, .98) 84%, rgba(126, 21, 16, .92)),
    linear-gradient(180deg, var(--abyss-nav-red-top), var(--abyss-nav-red-bottom)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 232, 166, .30),
    inset 0 -1px 0 rgba(28, 5, 2, .92),
    0 4px 9px rgba(0, 0, 0, .28) !important;
}

#Menu.abyss-menu-art .MenuButton::before {
  left: 31px !important;
  right: 31px !important;
  top: 11px !important;
  height: 26px !important;
  border-color: rgba(216, 168, 75, .26) !important;
  background:
    linear-gradient(90deg, transparent, rgba(255, 226, 132, .12), transparent),
    linear-gradient(180deg, rgba(35, 7, 4, .22), rgba(0, 0, 0, .16)) !important;
  box-shadow: inset 0 0 10px rgba(0, 0, 0, .36) !important;
}

#Menu.abyss-menu-art .MenuButton::after {
  line-height: 49px !important;
  font-size: 16px !important;
  color: #fff4c7 !important;
  -webkit-text-fill-color: #fff4c7 !important;
  text-shadow:
    0 1px 0 #000,
    0 0 6px rgba(216, 168, 75, .46) !important;
}

#Menu.abyss-menu-art .MenuButton > div {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 3 !important;
  pointer-events: none !important;
}

#Menu.abyss-menu-art .MenuButton .Button,
#Menu.abyss-menu-art .MenuButton .Extend {
  display: block !important;
  position: absolute !important;
  top: 50% !important;
  z-index: 4 !important;
  width: 24px !important;
  height: 28px !important;
  opacity: 1 !important;
  background:
    linear-gradient(135deg, rgba(255, 226, 132, .86), rgba(127, 76, 19, .86) 44%, rgba(72, 8, 10, .20) 45% 100%) !important;
  filter: drop-shadow(0 0 4px rgba(216, 168, 75, .28)) !important;
}

#Menu.abyss-menu-art .MenuButton .Button {
  left: 10px !important;
  clip-path: polygon(0 0, 100% 0, 24% 100%, 0 100%);
}

#Menu.abyss-menu-art .MenuButton .Extend {
  right: 10px !important;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 76% 100%);
  transform: scaleX(-1);
}

#Menu.abyss-menu-art .MenuButton .Button::after,
#Menu.abyss-menu-art .MenuButton .Extend::after {
  content: "";
  position: absolute;
  inset: 3px;
  border-top: 1px solid rgba(255, 242, 190, .56);
  border-left: 1px solid rgba(255, 242, 190, .36);
}

#Menu.abyss-menu-art .MenuButton:hover,
#Menu.abyss-menu-art .MenuButton:focus-visible {
  background:
    linear-gradient(90deg, rgba(141, 26, 18, .98), rgba(101, 14, 13, .99) 18%, rgba(82, 10, 10, .99) 50%, rgba(101, 14, 13, .99) 82%, rgba(141, 26, 18, .98)),
    linear-gradient(180deg, rgba(141, 26, 18, .98), rgba(82, 10, 10, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 232, 166, .38),
    inset 0 -1px 0 rgba(28, 5, 2, .94),
    0 0 11px rgba(216, 168, 75, .22),
    0 4px 9px rgba(0, 0, 0, .32) !important;
}

#Menu.abyss-menu-art .MenuButton:hover::after,
#Menu.abyss-menu-art .MenuButton:focus-visible::after,
#Menu.abyss-menu-art .MenuButton:active::after {
  color: #fff4c7 !important;
  -webkit-text-fill-color: #fff4c7 !important;
  text-shadow:
    0 1px 0 #000,
    0 0 7px rgba(216, 168, 75, .54) !important;
  opacity: 1 !important;
}

#Menu.abyss-menu-art .Submenu {
  gap: 4px !important;
}

#Menu.abyss-menu-art .Submenu a {
  height: 27px !important;
  min-height: 27px !important;
  border-color: rgba(216, 168, 75, .54) !important;
  border-radius: 3px !important;
  background:
    linear-gradient(90deg, rgba(6, 24, 37, .96), rgba(17, 63, 92, .90) 50%, rgba(6, 24, 37, .96)),
    linear-gradient(180deg, rgba(255, 232, 141, .06), rgba(0, 0, 0, .14)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 225, 125, .12),
    inset 0 -1px 0 rgba(0, 0, 0, .58) !important;
}

#Menu.abyss-menu-art .Submenuitem,
#Menu.abyss-menu-art .SubmenuitemLabel {
  line-height: 27px !important;
}

#Menu.abyss-menu-art .SubmenuitemLabel::before {
  top: 9px !important;
  border-color: rgba(216, 168, 75, .88) !important;
  background: linear-gradient(135deg, #061825, #00a6ff 48%, #03111f 52%, #0a355b) !important;
  box-shadow:
    0 0 0 1px rgba(1, 8, 14, .82),
    0 0 4px rgba(0, 166, 255, .62) !important;
}

#Menu.abyss-menu-art .Submenu a:hover,
#Menu.abyss-menu-art .Submenu a:focus-visible {
  border-color: rgba(255, 226, 132, .78) !important;
  background:
    linear-gradient(90deg, rgba(7, 30, 46, .98), rgba(19, 72, 106, .95) 50%, rgba(7, 30, 46, .98)),
    linear-gradient(180deg, rgba(255, 232, 141, .10), rgba(0, 0, 0, .10)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(95, 215, 255, .18),
    inset 0 0 12px rgba(0, 166, 255, .24),
    0 0 7px rgba(0, 166, 255, .22) !important;
}

#Menu.abyss-menu-art .Submenuitem.is-active {
  background:
    linear-gradient(90deg, rgba(60, 32, 5, .26), rgba(17, 63, 92, .74) 50%, rgba(60, 32, 5, .26)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(216, 168, 75, .70),
    inset 3px 0 0 rgba(216, 168, 75, .88),
    inset 0 0 12px rgba(0, 166, 255, .28) !important;
}

.abyss-download-art {
  width: 350px !important;
  max-width: none !important;
  min-height: 0 !important;
  aspect-ratio: 1536 / 520 !important;
  margin: -2px auto 10px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: url("images/abyssal/Dowlonad-novo-cropped-goldmatch-v1.png?v=20260530-download-goldmatch-v1") center center / 116% 200% no-repeat !important;
  box-shadow: none !important;
  filter:
    drop-shadow(0 10px 14px rgba(0, 0, 0, .48))
    drop-shadow(0 0 6px rgba(0, 166, 255, .24)) !important;
  overflow: visible !important;
}

.abyss-download-art::before,
.abyss-download-art::after {
  content: none !important;
  display: none !important;
}

.abyss-download-art:hover,
.abyss-download-art:focus-visible {
  border: 0 !important;
  background: url("images/abyssal/Dowlonad-novo-cropped-goldmatch-v1.png?v=20260530-download-goldmatch-v1") center center / 118% 118% no-repeat !important;
  box-shadow: none !important;
  filter:
    drop-shadow(0 10px 15px rgba(0, 0, 0, .52))
    drop-shadow(0 0 9px rgba(0, 166, 255, .52))
    drop-shadow(0 0 7px rgba(216, 168, 75, .36)) !important;
  transform: scale(1.02) !important;
}

.abyss-download-art:active {
  transform: scale(.99) !important;
}

/* Abyssal login/download art pass: keep these side modules on the same approved gold palette. */
.abyss-login-mini {
  display: block !important;
  width: 600px !important;
  max-width: none !important;
  aspect-ratio: 1536 / 1024 !important;
  min-height: 0 !important;
  margin: 0 auto -40px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: url("images/abyssal/PrimeiroLogin.png?v=20260531-primeiro-login-goldmatch-v3") center center / 90% 100% no-repeat !important;
  box-shadow: none !important;
  transform: translateX(-85px) !important;
}

.abyss-login-mini .abyss-mini-logo {
  display: none !important;
}

.abyss-login-mini.is-logged {
  margin: 0 auto -60px !important;
  background-image: url("images/abyssal/SegundoLogin.png?v=20260531-segundo-login-v3") !important;
}

.abyss-login-mini::before,
.abyss-login-mini::after {
  content: none !important;
  display: none !important;
}

.abyss-login-mini .fantasy-button,
.abyss-login-mini.is-logged .fantasy-button {
  display: block !important;
  position: absolute !important;
  z-index: 3 !important;
  pointer-events: auto !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-indent: 0 !important;
  padding: 0 !important;
  min-width: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  appearance: none !important;
  overflow: hidden !important;
  opacity: 1 !important;
  text-shadow: none !important;
  transition: none !important;
}

.abyss-login-mini .fantasy-button::before,
.abyss-login-mini.is-logged .fantasy-button::before {
  content: none !important;
  display: none !important;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

.abyss-login-mini .fantasy-button:link,
.abyss-login-mini .fantasy-button:visited,
.abyss-login-mini .fantasy-button:hover,
.abyss-login-mini .fantasy-button:focus,
.abyss-login-mini .fantasy-button:focus-visible,
.abyss-login-mini .fantasy-button:active,
.abyss-login-mini.is-logged .fantasy-button:link,
.abyss-login-mini.is-logged .fantasy-button:visited,
.abyss-login-mini.is-logged .fantasy-button:hover,
.abyss-login-mini.is-logged .fantasy-button:focus,
.abyss-login-mini.is-logged .fantasy-button:focus-visible,
.abyss-login-mini.is-logged .fantasy-button:active {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  outline: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  filter: none !important;
}

.abyss-login-mini .fantasy-button::after,
.abyss-login-mini.is-logged .fantasy-button::after {
  content: "" !important;
  position: absolute !important;
  inset: 8% 6% !important;
  display: block !important;
  border: 0 !important;
  border-radius: inherit !important;
  background:
    linear-gradient(180deg, rgba(255, 238, 166, .20) 0%, rgba(255, 211, 83, .08) 42%, rgba(45, 19, 4, .02) 100%),
    radial-gradient(ellipse at 50% 18%, rgba(255, 245, 182, .24) 0%, rgba(255, 216, 93, .08) 38%, rgba(255, 216, 93, 0) 72%) !important;
  box-shadow:
    inset 0 0 10px rgba(255, 229, 145, .16),
    inset 0 0 18px rgba(187, 112, 22, .10),
    0 0 12px rgba(255, 205, 72, .18) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity .18s ease, box-shadow .18s ease, filter .18s ease !important;
}

.abyss-login-mini .fantasy-button:hover,
.abyss-login-mini .fantasy-button:focus-visible {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  outline: 0 !important;
  transform: none !important;
}

.abyss-login-mini .fantasy-button:hover::after,
.abyss-login-mini .fantasy-button:focus-visible::after {
  box-shadow:
    inset 0 0 12px rgba(255, 235, 154, .25),
    inset 0 0 22px rgba(176, 99, 18, .16),
    0 0 10px rgba(255, 205, 72, .26),
    0 0 18px rgba(96, 45, 6, .18) !important;
  filter: saturate(1.08) brightness(1.05) !important;
  opacity: 1 !important;
}

.abyss-login-mini .abyss-login-mini__primary {
  left: 30.2% !important;
  top: 46.2% !important;
  width: 38.6% !important;
  height: 9.9% !important;
}

.abyss-login-mini .abyss-login-mini__primary,
.abyss-login-mini.is-logged .abyss-login-mini__primary {
  border-radius: 11px !important;
}

.abyss-login-mini .abyss-login-mini__secondary,
.abyss-login-mini.is-logged .abyss-login-mini__secondary {
  border-radius: 9px !important;
}

.abyss-login-mini .abyss-login-mini__download {
  border-radius: 13px !important;
}

.abyss-login-mini .abyss-login-mini__secondary::after,
.abyss-login-mini.is-logged .abyss-login-mini__secondary::after {
  inset: 13% 10% !important;
}

.abyss-login-mini .abyss-login-mini__download::after,
.abyss-login-mini.is-logged .abyss-login-mini__download::after {
  inset: 9% 7% !important;
}

.abyss-login-mini .abyss-login-mini__secondary {
  left: 35.1% !important;
  top: 55.3% !important;
  width: 29.3% !important;
  height: 7.1% !important;
}

.abyss-login-mini .abyss-login-mini__download {
  left: 26.2% !important;
  top: 69.2% !important;
  width: 47.5% !important;
  height: 13.4% !important;
}

.abyss-login-mini.is-logged .abyss-login-mini__primary {
  left: 33.8% !important;
  top: 43.2% !important;
  width: 32.8% !important;
  height: 8.8% !important;
}

.abyss-login-mini.is-logged .abyss-login-mini__secondary {
  left: 36.2% !important;
  top: 56.2% !important;
  width: 27.8% !important;
  height: 5.8% !important;
  font-size: 0 !important;
}

.abyss-login-mini.is-logged .abyss-login-mini__download {
  left: 28.8% !important;
  top: 66.2% !important;
  width: 42.6% !important;
  height: 10.4% !important;
}

.abyss-download-art {
  display: none !important;
}

.Content {
  position: static;
  width: 100%;
}

.Content .Box {
  position: relative;
  margin: 0 0 18px;
  overflow: hidden;
  color: var(--abyss-text);
  font-size: 1rem;
}

.Content .Corner-tl,
.Content .Corner-tr,
.Content .Corner-bl,
.Content .Corner-br,
.Content .CornerWrapper-b,
.Content .Border_1,
.Content .BorderTitleText {
  display: none !important;
}

.Content .Title {
  position: static;
  display: none;
}

.Content .Box::before {
  content: attr(data-title);
  display: block;
  padding: 12px 18px;
  border-bottom: 1px solid rgba(216, 168, 75, .46);
  background: linear-gradient(180deg, rgba(13, 55, 101, .95), rgba(4, 16, 29, .96));
  color: var(--abyss-gold-2);
  font-family: Cinzel, Georgia, serif;
  font-size: 22px;
  font-weight: 800;
  text-transform: uppercase;
  text-shadow: 0 0 14px rgba(0, 166, 255, .62);
}

.Content #NewsTicker.Box::before,
.Content #newsticker.Box::before {
  content: "News Ticker";
}

.Content #FeaturedArticle.Box::before {
  content: "Featured Article";
}

.Content .Border_2,
.Content .Border_3 {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

.Content .BoxContent {
  min-height: 120px;
  height: auto !important;
  padding: 14px 16px;
  background:
    linear-gradient(180deg, rgba(255, 246, 224, .97), rgba(239, 222, 187, .97));
  color: #3a210e;
  font-family: Inter, Verdana, Arial, sans-serif;
  font-size: 13px;
  line-height: 1.5;
}

.Content .BoxContent table,
.Content .BoxContent td {
  color: #3a210e !important;
  font-size: 13px;
  line-height: 1.5;
}

.Content .BoxContent p {
  margin: 8px 0;
  color: #4a2a12;
}

.Content .BoxContent b,
.Content .BoxContent strong {
  color: #5b2b06;
  font-weight: 800;
}

.Content .BoxContent a {
  color: #0077a8;
  font-weight: 800;
}

.Content .BoxContent a:hover {
  color: #8c4a00;
}

#NewsTicker .BoxContent,
#FeaturedArticle .BoxContent {
  min-height: 86px;
}

#NewsTicker .BoxContent {
  position: relative;
  height: 178px !important;
  box-sizing: border-box;
  overflow-y: auto;
  padding: 14px 12px 24px 12px;
  border-bottom: 5px solid rgba(216, 168, 75, .96);
  box-shadow:
    inset 0 -2px 0 rgba(91, 43, 6, .92),
    inset 0 -7px 0 rgba(91, 43, 6, .72);
  scrollbar-color: rgba(0, 166, 255, .58) rgba(3, 16, 31, .22);
  scrollbar-width: thin;
}

#NewsTicker .BoxContent::-webkit-scrollbar {
  width: 10px;
}

#NewsTicker .BoxContent::-webkit-scrollbar-track {
  background: rgba(3, 16, 31, .10);
}

#NewsTicker .BoxContent::-webkit-scrollbar-thumb {
  border: 2px solid rgba(3, 16, 31, .18);
  border-radius: 999px;
  background: rgba(0, 166, 255, .58);
}

#NewsTicker .Row,
#NewsTicker .Odd,
#NewsTicker .Even {
  min-height: 26px;
  background: rgba(123, 86, 28, .18) !important;
  border: 1px solid rgba(121, 76, 20, .42);
}

#NewsTicker .NewsTickerText {
  min-height: 26px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 3px 28px 3px 8px;
  color: #2f1b0c;
  font-size: 13px;
}

#NewsTicker .Row {
  position: relative;
  cursor: pointer;
}

#NewsTicker .NewsTickerExtend {
  position: absolute;
  right: 9px;
  top: 50%;
  width: 18px;
  height: 18px;
  transform: translateY(-50%);
  display: grid;
  place-items: center;
  border-radius: 50%;
  font-family: Cinzel, Georgia, serif;
  font-size: 18px;
  font-weight: 800;
  line-height: 1;
  background-image: none !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .82);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18), 0 0 8px currentColor;
}

#NewsTicker .NewsTickerExtend.is-closed {
  color: #ff4c3f;
  background: rgba(85, 9, 7, .72);
}

#NewsTicker .NewsTickerExtend.is-open {
  color: #52ff7d;
  background: rgba(6, 67, 25, .72);
}

#NewsTicker .NewsTickerDate {
  color: #5b2b06;
  font-weight: 800;
  white-space: nowrap;
}

#NewsTicker .NewsTickerShortText,
#NewsTicker .NewsTickerFullText {
  color: #3a210e;
  font-weight: 700;
}

#NewsTicker .NewsTickerFullText {
  display: none;
}

#FeaturedArticle .BoxContent {
  position: relative;
  min-height: 150px;
  padding: 18px;
}

#FeaturedArticle .abyss-featured-layout {
  display: grid;
  grid-template-columns: 126px minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 14px;
  align-items: start;
  min-height: 126px;
}

#FeaturedArticle #TeaserThumbnail {
  grid-column: 1;
  grid-row: 1;
  width: 126px !important;
  min-height: 90px;
  text-align: center;
}

#FeaturedArticle #TeaserText {
  grid-column: 2;
  grid-row: 1 / span 2;
  min-height: 90px;
  padding: 8px 10px;
  color: #3a210e;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.45;
}

#FeaturedArticle #TeaserText p {
  margin: 0 0 10px;
  color: #5b2b06;
  font-size: 14px;
  font-weight: 800;
}

#FeaturedArticle img {
  max-width: 126px;
  height: auto;
}

#FeaturedArticle #Link {
  grid-column: 1;
  grid-row: 2;
  align-self: start;
  margin-top: 4px;
}

#FeaturedArticle .abyss-featured-title {
  margin-bottom: 2px;
}

#FeaturedArticle .read-more,
#FeaturedArticle a {
  font-weight: 800;
}

#news .BoxContent {
  padding: 18px;
}

#latest-news {
  scroll-margin-top: 14px;
}

#news .NewsHeadline {
  margin: 0 0 8px;
}

.Content .NewsHeadlineBackground,
.TableContainer .CaptionContainer,
.TableContainer .CaptionInnerContainer {
  min-height: 30px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  border: 1px solid rgba(216, 168, 75, .55);
  background:
    linear-gradient(180deg, rgba(12, 58, 100, .98), rgba(3, 17, 31, .98)) !important;
  box-shadow: inset 0 0 18px rgba(0, 166, 255, .2);
}

.Content .NewsHeadlineText,
.Content .NewsHeadlineDate,
.TableContainer .CaptionContainer .Text {
  color: var(--abyss-gold-2) !important;
  font-size: 14px;
  font-weight: 800;
  line-height: 1;
}

.Content .NewsHeadlineIcon {
  position: static !important;
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
}

.Content .NewsHeadlineDate,
.Content .NewsHeadlineText {
  position: static !important;
  float: none !important;
  display: inline-flex;
  align-items: center;
}

#news table {
  margin: 0 0 14px;
  border: 1px solid rgba(121, 76, 20, .24);
  background: rgba(255, 252, 242, .42);
}

#news table td {
  padding: 12px 14px !important;
}

#news table + br {
  display: none;
}

#newsarchive .BoxContent,
#news .BoxContent {
  min-height: 320px;
}

.abyss-news-panel {
  width: 100%;
  color: #3a210e;
}

.abyss-news-panel__headline,
.abyss-news-detail__headline {
  min-height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 12px;
  border: 1px solid rgba(216, 168, 75, .55);
  background:
    linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98));
  color: #fff4c7;
  font-family: Verdana, Arial, sans-serif;
  font-size: 14px;
  font-weight: 800;
  line-height: 1;
  text-align: center;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, .8);
  box-shadow: inset 0 0 18px rgba(255, 196, 92, .18);
}

.abyss-news-panel__body,
.abyss-news-detail__content {
  border: 1px solid rgba(121, 76, 20, .36);
  border-top: 0;
  background:
    linear-gradient(rgba(255, 252, 242, .88), rgba(255, 248, 226, .82)),
    var(--abyss-scroll);
  min-height: 300px;
}

.abyss-news-archive__list {
  background: rgba(255, 252, 242, .42);
}

.abyss-news-archive__row {
  display: grid;
  grid-template-columns: 34px 118px 1fr;
  align-items: center;
  min-height: 32px;
  padding: 4px 10px;
  border-top: 1px solid rgba(121, 76, 20, .26);
  color: #3a210e;
  font-size: 13px;
  text-decoration: none;
  transition: background .16s ease, box-shadow .16s ease, color .16s ease;
}

.abyss-news-archive__row:first-child {
  border-top: 0;
}

.abyss-news-archive__row:nth-child(odd) {
  background: rgba(123, 86, 28, .12);
}

.abyss-news-archive__row:hover,
.abyss-news-archive__row:focus-visible {
  outline: 0;
  background: linear-gradient(180deg, rgba(89, 196, 255, .20), rgba(216, 168, 75, .13));
  box-shadow:
    inset 0 0 0 1px rgba(0, 166, 255, .24),
    inset 0 0 14px rgba(0, 166, 255, .16);
}

.abyss-news-archive__icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

.abyss-news-archive__icon img {
  width: 16px;
  height: 16px;
  image-rendering: auto;
}

.abyss-news-archive__date {
  color: #5b2b06;
  font-weight: 700;
  white-space: nowrap;
}

.abyss-news-archive__title {
  color: #0077a8;
  font-weight: 800;
  text-align: left;
}

.abyss-news-archive__row:hover .abyss-news-archive__title,
.abyss-news-archive__row:focus-visible .abyss-news-archive__title {
  color: #8c4a00;
}

.abyss-news-archive__empty {
  min-height: 72px;
  display: flex;
  align-items: center;
  padding: 12px;
  color: #5b2b06;
  font-weight: 700;
}

.abyss-news-detail {
  min-height: 360px;
}

.abyss-news-detail__icon {
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

.abyss-news-detail__icon img {
  max-width: 24px;
  max-height: 24px;
}

.abyss-news-detail__date,
.abyss-news-detail__title {
  color: #fff4c7;
  font-family: Verdana, Arial, sans-serif;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.2;
}

.Content .BoxContent .abyss-news-detail__title {
  color: #fff4c7;
}

.abyss-news-detail__headline {
  justify-content: flex-start;
  text-align: left;
}

.abyss-news-detail__author {
  padding: 8px 12px;
  border-left: 1px solid rgba(121, 76, 20, .36);
  border-right: 1px solid rgba(121, 76, 20, .36);
  background: rgba(255, 248, 226, .72);
  color: #5b2b06;
  font-size: 12px;
}

.abyss-news-detail__content {
  padding: 14px 16px 44px;
  font-size: 14px;
  line-height: 1.55;
}

.abyss-news-detail__content p {
  margin: 0 0 12px;
}

.abyss-news-detail__comments {
  margin-top: -38px;
  padding: 0 16px 16px;
  position: relative;
  text-align: right;
  font-weight: 800;
}

.abyss-news-detail__comments a,
.abyss-news-archive__title {
  color: #005db8;
}

.abyss-news-detail__comments a:hover,
.abyss-news-archive__row:hover .abyss-news-archive__title,
.abyss-news-archive__row:focus-visible .abyss-news-archive__title {
  color: #8c180e;
}

.abyss-news-back {
  margin-top: 14px;
}

.abyss-news-back .fantasy-button {
  width: 122px;
}

#eventcalendar .BoxContent {
  min-height: 560px;
  padding: 10px 12px 18px;
}

.abyss-event-calendar {
  width: 100%;
  color: #3a210e;
  font-family: Verdana, Arial, sans-serif;
  scroll-margin-top: 14px;
}

.abyss-event-calendar__top {
  min-height: 34px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0 8px;
  border: 2px solid #7b1c10;
  border-bottom: 0;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98));
  color: #fff4c7;
  font-size: 15px;
  font-weight: 800;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, .85);
  box-shadow:
    inset 0 0 0 1px rgba(250, 240, 215, .18),
    2px 0 3px rgba(66, 38, 18, .45);
}

.abyss-event-calendar__top strong {
  grid-column: 2;
  text-align: center;
}

.abyss-event-calendar__top time {
  grid-column: 2;
  justify-self: center;
  white-space: nowrap;
}

.abyss-event-calendar__frame {
  padding: 10px;
  border: 2px solid #5f4d41;
  border-top: 0;
  background: #f1e0c5;
  box-shadow: 2px 2px 3px rgba(66, 38, 18, .62);
}

.abyss-event-calendar__table {
  width: 100%;
  table-layout: fixed;
  display: table !important;
  border-collapse: separate;
  border-spacing: 1px;
  border: 2px solid #7b1c10;
  background: #d4c0a1;
  box-shadow:
    2px 2px 3px rgba(66, 38, 18, .62),
    inset 0 0 0 1px rgba(250, 240, 215, .42);
}

.abyss-event-calendar__table thead,
.abyss-event-calendar__table tbody {
  display: table-row-group !important;
}

.abyss-event-calendar__table tr {
  display: table-row !important;
}

.abyss-event-calendar__table th {
  display: table-cell !important;
  height: 27px;
  border: 1px solid #faf0d7;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98));
  color: #fff4c7;
  font-family: Verdana, Arial, sans-serif;
  font-size: 14px;
  font-weight: 800;
  text-align: center;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, .8);
}

.abyss-event-calendar__table td {
  display: table-cell !important;
  height: 86px;
  vertical-align: top;
  border: 1px solid #faf0d7;
  background: #e7d1af;
  color: #5f4d41;
  overflow: hidden;
  padding: 4px 5px;
}

.abyss-event-calendar__table td.is-empty {
  background: #d4c0a1;
}

.abyss-event-calendar__table td.is-today {
  background: #f3e5d0;
  box-shadow: inset 0 0 0 2px rgba(126, 21, 16, .35);
}

.abyss-event-calendar__day {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  min-height: 20px;
  color: #5f4d41;
  font-size: 14px;
  font-weight: 800;
  margin-bottom: 2px;
}

.abyss-event-calendar__day img {
  width: 12px;
  height: 12px;
}

.abyss-event-calendar__event {
  display: block;
  max-width: 100%;
  min-height: 18px;
  margin: 4px 0 0;
  padding: 3px 6px;
  color: #fff;
  border: 1px solid rgba(255, 232, 178, .55);
  border-radius: 2px;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: help;
  text-align: center;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, .72);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .18),
    0 1px 2px rgba(70, 25, 10, .35);
}

.abyss-event-calendar__event:hover {
  filter: brightness(1.12);
}

.abyss-event-calendar__note {
  margin: 14px 0 2px;
  color: #5b2b06;
  font-size: 12px;
  font-weight: 600;
}

#downloadclient .BoxContent {
  padding: 16px;
}

.abyss-downloads {
  color: #f5e8c4;
  font-family: Verdana, Arial, sans-serif;
}

.abyss-downloads__hero {
  min-height: 148px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  padding: 24px;
  border: 1px solid rgba(216, 168, 75, .38);
  background:
    linear-gradient(135deg, rgba(3, 16, 31, .96), rgba(75, 16, 13, .86)),
    url("images/abyssal/hero.jpg") center / cover;
  box-shadow:
    inset 0 0 0 1px rgba(255, 239, 178, .08),
    0 18px 32px rgba(0, 0, 0, .34);
}

.abyss-downloads__hero span {
  display: block;
  color: #62cdf8;
  font-family: Cinzel, Georgia, serif;
  font-size: 14px;
  font-weight: 800;
  text-transform: uppercase;
}

.abyss-downloads__hero h1 {
  margin: 4px 0 8px;
  color: #ffe7a4;
  font-family: Cinzel, Georgia, serif;
  font-size: 34px;
  line-height: 1;
  text-shadow: 0 2px 0 rgba(0, 0, 0, .85);
}

.abyss-downloads__hero p {
  max-width: 520px;
  margin: 0;
  color: rgba(245, 232, 196, .88);
  font-size: 14px;
  line-height: 1.5;
}

.abyss-downloads__hero .fantasy-button {
  width: 148px;
}

.abyss-downloads__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 16px;
}

.abyss-download-card {
  min-height: 214px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  padding: 20px 14px 18px;
  border: 1px solid rgba(216, 168, 75, .38);
  background: linear-gradient(180deg, rgba(8, 25, 41, .94), rgba(4, 12, 22, .96));
  color: #f5e8c4;
  text-align: center;
  text-decoration: none;
  box-shadow:
    inset 0 0 0 1px rgba(255, 239, 178, .06),
    0 10px 20px rgba(0, 0, 0, .28);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.abyss-download-card:hover,
.abyss-download-card:focus-visible {
  color: #fff3c7;
  border-color: rgba(98, 205, 248, .66);
  transform: translateY(-3px);
  box-shadow:
    inset 0 0 0 1px rgba(255, 239, 178, .08),
    0 16px 28px rgba(0, 0, 0, .36),
    0 0 22px rgba(98, 205, 248, .18);
}

.abyss-download-card__image {
  width: 96px;
  height: 96px;
  display: grid;
  place-items: center;
}

.abyss-download-card__image img {
  max-width: 96px;
  max-height: 96px;
  object-fit: contain;
  filter: drop-shadow(0 8px 10px rgba(0, 0, 0, .5));
}

.abyss-download-card--discord .abyss-download-card__image img {
  max-width: 136px;
}

.abyss-download-card--wasd .abyss-download-card__image img {
  max-width: 68px;
}

.abyss-download-card strong {
  color: #ffe7a4;
  font-family: Cinzel, Georgia, serif;
  font-size: 19px;
  line-height: 1.15;
}

.abyss-download-card small {
  color: rgba(245, 232, 196, .76);
  font-size: 12px;
  line-height: 1.35;
}

.abyss-downloads__notice {
  margin-top: 16px;
  padding: 14px 16px;
  border: 1px solid rgba(216, 168, 75, .34);
  background: rgba(3, 16, 31, .72);
  color: rgba(245, 232, 196, .82);
  font-size: 12px;
  line-height: 1.5;
}

.abyss-downloads__notice strong {
  display: block;
  margin-bottom: 4px;
  color: #ffe7a4;
  font-family: Cinzel, Georgia, serif;
  font-size: 15px;
}

.abyss-downloads__notice p {
  margin: 0;
}

@media (max-width: 980px) {
  .abyss-downloads__hero {
    grid-template-columns: 1fr;
  }

  .abyss-downloads__hero .fantasy-button {
    justify-self: start;
  }

  .abyss-downloads__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  #downloadclient .BoxContent {
    padding: 10px;
  }

  .abyss-downloads__hero {
    padding: 18px;
  }

  .abyss-downloads__hero h1 {
    font-size: 28px;
  }

  .abyss-downloads__grid {
    grid-template-columns: 1fr;
  }

  .abyss-download-card {
    min-height: 0;
  }
}

.TableContainer,
.Table1,
.Table2,
.Table3,
.Table4,
.Table5,
.TableContentContainer {
  border-color: rgba(216, 168, 75, .45) !important;
  background: rgba(4, 15, 27, .88) !important;
  color: var(--abyss-text);
}

.TableContainer .Odd,
.TableContainer .Even,
.Content .BoxContent .Odd,
.Content .BoxContent .Even {
  background: rgba(255, 255, 255, .04) !important;
}

input[type="text"],
input[type="password"],
input[type="email"],
select,
textarea {
  width: 100%;
  min-height: 38px;
  border: 1px solid rgba(216, 168, 75, .52);
  border-radius: 6px;
  background: rgba(0, 5, 10, .75);
  color: #fff;
  padding: 8px 10px;
  outline: none;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--abyss-blue);
  box-shadow: 0 0 0 3px rgba(0, 166, 255, .2);
}

#accountmanagement .BoxContent,
#createaccount .BoxContent,
#lostaccount .BoxContent,
#rules .BoxContent,
#downloadclient .BoxContent,
#bugtracker .BoxContent {
  background:
    radial-gradient(circle at 50% 0, rgba(0, 166, 255, .18), transparent 58%),
    linear-gradient(180deg, rgba(5, 28, 50, .96), rgba(1, 8, 16, .97));
  color: var(--abyss-text);
}

.Content #accountmanagement.Box > .Border_2 > .Border_3 > .BoxContent,
.Content #createaccount.Box > .Border_2 > .Border_3 > .BoxContent,
.Content #lostaccount.Box > .Border_2 > .Border_3 > .BoxContent,
.Content #rules.Box > .Border_2 > .Border_3 > .BoxContent,
.Content #downloadclient.Box > .Border_2 > .Border_3 > .BoxContent,
.Content #bugtracker.Box > .Border_2 > .Border_3 > .BoxContent {
  background:
    radial-gradient(circle at 50% 0, rgba(0, 166, 255, .18), transparent 58%),
    linear-gradient(180deg, rgba(5, 28, 50, .96), rgba(1, 8, 16, .97)) !important;
  color: var(--abyss-text) !important;
}

#accountmanagement .BoxContent table,
#accountmanagement .BoxContent td,
#createaccount .BoxContent table,
#createaccount .BoxContent td,
#lostaccount .BoxContent table,
#lostaccount .BoxContent td,
#rules .BoxContent table,
#rules .BoxContent td,
#downloadclient .BoxContent table,
#downloadclient .BoxContent td,
#bugtracker .BoxContent table,
#bugtracker .BoxContent td {
  color: var(--abyss-text) !important;
}

#accountmanagement .TableContainer,
#createaccount .TableContainer,
#lostaccount .TableContainer,
#rules .TableContainer,
#downloadclient .TableContainer,
#bugtracker .TableContainer {
  margin: 0 0 18px;
  border: 1px solid rgba(216, 168, 75, .68) !important;
  border-radius: 7px;
  background:
    linear-gradient(180deg, rgba(7, 31, 55, .94), rgba(1, 9, 18, .96)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(0, 166, 255, .18),
    inset 0 0 26px rgba(0, 166, 255, .10),
    0 10px 24px rgba(0, 0, 0, .34);
  overflow: hidden;
}

#accountmanagement .CaptionContainer,
#accountmanagement .CaptionInnerContainer,
#createaccount .CaptionContainer,
#createaccount .CaptionInnerContainer,
#lostaccount .CaptionContainer,
#lostaccount .CaptionInnerContainer,
#rules .CaptionContainer,
#rules .CaptionInnerContainer,
#downloadclient .CaptionContainer,
#downloadclient .CaptionInnerContainer,
#bugtracker .CaptionContainer,
#bugtracker .CaptionInnerContainer {
  min-height: 36px;
  justify-content: center;
  border: 0;
  border-bottom: 1px solid rgba(216, 168, 75, .58);
  border-radius: 0;
  background:
    linear-gradient(180deg, rgba(11, 64, 111, .98), rgba(1, 16, 31, .98)) !important;
  box-shadow:
    inset 0 0 18px rgba(0, 166, 255, .22),
    inset 0 -1px 0 rgba(0, 0, 0, .55);
}

#accountmanagement .CaptionContainer span,
#createaccount .CaptionContainer span,
#lostaccount .CaptionContainer span,
#rules .CaptionContainer span,
#downloadclient .CaptionContainer span,
#bugtracker .CaptionContainer span {
  display: none !important;
}

#accountmanagement .CaptionContainer .Text,
#createaccount .CaptionContainer .Text,
#lostaccount .CaptionContainer .Text,
#rules .CaptionContainer .Text,
#downloadclient .CaptionContainer .Text,
#bugtracker .CaptionContainer .Text {
  font-family: Cinzel, Georgia, serif;
  color: var(--abyss-gold-2) !important;
  font-size: 18px;
  text-transform: uppercase;
  text-shadow: 0 0 12px rgba(0, 166, 255, .62), 1px 1px 0 rgba(0, 0, 0, .85);
}

#accountmanagement .InnerTableContainer,
#createaccount .InnerTableContainer,
#lostaccount .InnerTableContainer,
#rules .InnerTableContainer,
#downloadclient .InnerTableContainer,
#bugtracker .InnerTableContainer {
  padding: 12px;
}

#accountmanagement .TableContentContainer,
#createaccount .TableContentContainer,
#lostaccount .TableContentContainer,
#rules .TableContentContainer,
#downloadclient .TableContentContainer,
#bugtracker .TableContentContainer {
  border: 1px solid rgba(216, 168, 75, .34) !important;
  border-radius: 6px;
  background:
    linear-gradient(180deg, rgba(8, 34, 58, .88), rgba(2, 13, 24, .92)) !important;
  box-shadow: inset 0 0 22px rgba(0, 166, 255, .10);
  overflow: hidden;
}

#accountmanagement .TableContent,
#createaccount .TableContent,
#lostaccount .TableContent,
#rules .TableContent,
#downloadclient .TableContent,
#bugtracker .TableContent {
  border: 0 !important;
  background: transparent !important;
}

#accountmanagement tr,
#createaccount tr,
#lostaccount tr,
#rules tr,
#downloadclient tr,
#bugtracker tr {
  background: transparent !important;
}

#accountmanagement .TableContent td,
#createaccount .TableContent td,
#lostaccount .TableContent td,
#rules .TableContent td,
#downloadclient .TableContent td,
#bugtracker .TableContent td,
#accountmanagement td[bgcolor],
#createaccount td[bgcolor],
#lostaccount td[bgcolor],
#rules td[bgcolor],
#downloadclient td[bgcolor],
#bugtracker td[bgcolor] {
  background: rgba(255, 255, 255, .035) !important;
}

#accountmanagement .TableContent tr:nth-child(even) td,
#createaccount .TableContent tr:nth-child(even) td,
#lostaccount .TableContent tr:nth-child(even) td,
#rules .TableContent tr:nth-child(even) td,
#downloadclient .TableContent tr:nth-child(even) td,
#bugtracker .TableContent tr:nth-child(even) td {
  background: rgba(0, 166, 255, .045) !important;
}

#accountmanagement .LabelH td,
#createaccount .LabelH td,
#lostaccount .LabelH td,
#rules .LabelH td,
#downloadclient .LabelH td,
#bugtracker .LabelH td,
#bugtracker table tr:first-child td[class="white"] {
  background:
    linear-gradient(180deg, rgba(13, 69, 118, .86), rgba(2, 20, 38, .92)) !important;
  color: var(--abyss-gold-2) !important;
  font-weight: 800;
}

#accountmanagement .LabelV,
#createaccount .LabelV,
#lostaccount .LabelV,
#rules .LabelV,
#downloadclient .LabelV,
#bugtracker .LabelV {
  color: var(--abyss-gold-2) !important;
  font-weight: 800;
}

#accountmanagement input[type="checkbox"],
#accountmanagement input[type="radio"],
#createaccount input[type="checkbox"],
#createaccount input[type="radio"],
#lostaccount input[type="checkbox"],
#lostaccount input[type="radio"],
#rules input[type="checkbox"],
#rules input[type="radio"],
#downloadclient input[type="checkbox"],
#downloadclient input[type="radio"],
#bugtracker input[type="checkbox"],
#bugtracker input[type="radio"] {
  width: auto;
  min-height: 0;
  padding: 0;
}

#accountmanagement p,
#createaccount p,
#lostaccount p,
#rules p,
#downloadclient p,
#bugtracker p,
#accountmanagement li,
#createaccount li,
#lostaccount li,
#rules li,
#downloadclient li,
#bugtracker li {
  color: var(--abyss-text);
}

#accountmanagement h1,
#accountmanagement h2,
#createaccount h1,
#createaccount h2,
#lostaccount h1,
#lostaccount h2,
#rules h1,
#rules h2,
#downloadclient h1,
#downloadclient h2,
#bugtracker h1,
#bugtracker h2 {
  color: var(--abyss-gold-2);
  font-family: Cinzel, Georgia, serif;
  text-shadow: 0 0 14px rgba(0, 166, 255, .5);
}

#accountmanagement a,
#createaccount a,
#lostaccount a,
#rules a,
#downloadclient a,
#bugtracker a {
  color: #61d7ff;
}

#accountmanagement a:hover,
#createaccount a:hover,
#lostaccount a:hover,
#rules a:hover,
#downloadclient a:hover,
#bugtracker a:hover {
  color: var(--abyss-gold-2);
}

#accountmanagement .BigButton,
#createaccount .BigButton,
#lostaccount .BigButton,
#rules .BigButton,
#downloadclient .BigButton,
#bugtracker .BigButton,
#bugtracker .input2 {
  border: 1px solid rgba(216, 168, 75, .72);
  border-radius: 6px;
  background:
    linear-gradient(180deg, rgba(0, 166, 255, .72), rgba(0, 63, 104, .94)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, .22),
    0 0 12px rgba(0, 166, 255, .32);
}

#bugtracker > .BoxContent > br:first-child {
  display: none;
}

/* Internal submenu pages use the same light content surface as News. */
:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) .BoxContent {
  background:
    linear-gradient(180deg, rgba(255, 246, 224, .97), rgba(239, 222, 187, .97)) !important;
  color: #3a210e !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) .BoxContent :is(table, tbody, tr, td, th, p, li, div, span) {
  color: #3a210e !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) :is(.TableContainer, .TableContentContainer) {
  border: 1px solid rgba(121, 76, 20, .36) !important;
  border-radius: 0 !important;
  background: rgba(255, 252, 242, .42) !important;
  box-shadow: none !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) :is(.CaptionContainer, .CaptionInnerContainer, .LabelH td, th, .TableContent tr:first-child td[class="white"]) {
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  border-color: #8a1f12 !important;
  color: #fff4c7 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-weight: 800 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .78) !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) :is(.CaptionContainer .Text, .LabelH td, .LabelV, th) {
  color: #fff4c7 !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) :is(.TableContent, .TableContent td, td[bgcolor], .Odd, .Even) {
  background: transparent !important;
  border-color: rgba(121, 76, 20, .22) !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) :is(.TableContent tr:nth-child(odd) td, .Odd) {
  background: rgba(123, 86, 28, .10) !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) :is(a, .Link) {
  color: #005db8 !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) :is(a:hover, .Link:hover) {
  color: #8c180e !important;
}

#accountmanagement .BoxContent {
  padding: 10px 12px 18px !important;
}

#accountmanagement .abyss-account-welcome {
  display: none;
}

#accountmanagement .TableContainer {
  margin: 0 0 18px !important;
  border: 2px solid #2f2b25 !important;
  border-radius: 0 !important;
  background:
    linear-gradient(180deg, rgba(255, 248, 231, .98), rgba(235, 217, 180, .98)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, .55),
    0 2px 0 rgba(0, 0, 0, .36) !important;
}

#accountmanagement .CaptionContainer,
#accountmanagement .CaptionInnerContainer {
  min-height: 34px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  padding: 0 !important;
  border: 0 !important;
  border-bottom: 2px solid #2f2b25 !important;
  background:
    linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 231, 155, .25),
    inset 0 -1px 0 rgba(0, 0, 0, .58) !important;
}

#accountmanagement .CaptionContainer .Text {
  display: block !important;
  padding: 0 12px !important;
  color: #fff4c7 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 34px !important;
  text-align: left !important;
  text-transform: none !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .86) !important;
}

#accountmanagement .CaptionContainer span {
  display: none !important;
}

#accountmanagement .InnerTableContainer {
  padding: 8px !important;
}

#accountmanagement .TableContentContainer {
  border: 1px solid rgba(92, 61, 27, .62) !important;
  border-radius: 0 !important;
  background: #d7c29d !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 248, 230, .66),
    0 1px 0 rgba(0, 0, 0, .22) !important;
}

#accountmanagement .TableContent {
  width: 100% !important;
  border: 0 !important;
  border-collapse: collapse !important;
  background: transparent !important;
}

#accountmanagement .TableContent td,
#accountmanagement .TableContent th {
  padding: 5px 7px !important;
  border-color: rgba(255, 248, 230, .62) !important;
  color: #4b2109 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.25 !important;
  vertical-align: middle !important;
}

#accountmanagement .TableContent tr:nth-child(odd) td {
  background: rgba(255, 250, 238, .36) !important;
}

#accountmanagement .TableContent tr:nth-child(even) td {
  background: rgba(123, 86, 28, .12) !important;
}

#accountmanagement .LabelH td,
#accountmanagement .TableContent th {
  background: #d4bb91 !important;
  color: #4b2109 !important;
  font-weight: 800 !important;
  text-shadow: none !important;
}

#accountmanagement .LabelV {
  width: 150px !important;
  color: #5b2b06 !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}

#accountmanagement .BigBoldText {
  color: #ff1717 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-weight: 800 !important;
  text-shadow: none !important;
}

#accountmanagement .AccountStatusImage {
  display: none !important;
}

#accountmanagement .premiumbenefits {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  align-items: center;
  min-height: 56px;
}

#accountmanagement .premiumbenefits > div {
  display: flex !important;
  align-items: center !important;
  gap: 8px;
  justify-content: center !important;
  color: #642b08 !important;
  font-size: 13px !important;
}

#accountmanagement .PremiumFeatureImage1 {
  width: 32px !important;
  height: 32px !important;
  object-fit: contain !important;
  margin: 0 !important;
  filter: drop-shadow(0 1px 0 rgba(255, 248, 230, .65));
}

#accountmanagement .abyss-download-client-row {
  min-height: 72px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
}

#accountmanagement .abyss-download-client-row .DownloadClientImageLink {
  min-width: 104px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  text-align: center !important;
}

#accountmanagement .abyss-download-client-row img {
  width: 56px !important;
  height: 56px !important;
  object-fit: contain !important;
}

#accountmanagement .abyss-button-row {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
  margin: 2px 0 0 7px !important;
}

#accountmanagement .abyss-account-actions {
  width: 132px !important;
  min-width: 132px !important;
  text-align: right !important;
}

#accountmanagement .abyss-account-actions form {
  width: 132px !important;
  height: 25px !important;
  margin-left: auto !important;
}

#accountmanagement .abyss-account-actions .BigButton,
#accountmanagement .abyss-public-info-action .BigButton {
  width: 132px !important;
  max-width: 132px !important;
  height: 25px !important;
  min-height: 25px !important;
}

#accountmanagement .abyss-account-actions .BigButtonText,
#accountmanagement .abyss-public-info-action .BigButtonText {
  width: 100% !important;
  height: 23px !important;
  min-height: 23px !important;
  padding: 0 !important;
  line-height: 23px !important;
  text-align: center !important;
}

#accountmanagement .abyss-account-actions .abyss-action-getcoins .BigButton {
  border-color: #3b2300 !important;
  background:
    linear-gradient(180deg, #fff08a 0%, #f1b51f 38%, #b06a00 72%, #6c3300 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 224, .95),
    inset 0 -2px 0 rgba(67, 30, 0, .55),
    0 0 9px rgba(255, 196, 45, .48) !important;
}

#accountmanagement .abyss-account-actions .abyss-action-getcoins .BigButton:hover,
#accountmanagement .abyss-account-actions .abyss-action-getcoins .BigButton:focus-within {
  filter: brightness(1.18) saturate(1.18) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 224, 1),
    inset 0 -2px 0 rgba(67, 30, 0, .48),
    0 0 16px rgba(255, 213, 59, .9) !important;
}

#accountmanagement .abyss-account-actions .abyss-action-getcoins .BigButton:hover .BigButtonText,
#accountmanagement .abyss-account-actions .abyss-action-getcoins .BigButton:focus-within .BigButtonText {
  background:
    linear-gradient(180deg, #fff7b4 0%, #ffd23d 36%, #d88b00 72%, #7a3900 100%) !important;
}

#accountmanagement .abyss-account-actions .abyss-action-logout .BigButton {
  border-color: #3a0000 !important;
  background:
    linear-gradient(180deg, #ff6a5d 0%, #e00000 42%, #8f0000 72%, #4c0000 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 218, 210, .7),
    inset 0 -2px 0 rgba(48, 0, 0, .58),
    0 0 9px rgba(255, 32, 18, .38) !important;
}

#accountmanagement .abyss-account-actions .abyss-action-logout .BigButton:hover,
#accountmanagement .abyss-account-actions .abyss-action-logout .BigButton:focus-within {
  filter: brightness(1.16) saturate(1.22) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 225, 218, .88),
    inset 0 -2px 0 rgba(48, 0, 0, .52),
    0 0 15px rgba(255, 44, 28, .78) !important;
}

#accountmanagement .abyss-account-actions .abyss-action-logout .BigButton:hover .BigButtonText,
#accountmanagement .abyss-account-actions .abyss-action-logout .BigButton:focus-within .BigButtonText {
  background:
    linear-gradient(180deg, #ff8a7d 0%, #ff1212 42%, #b00000 72%, #5b0000 100%) !important;
}

#accountmanagement .abyss-public-info-action {
  width: 150px !important;
  min-width: 150px !important;
}

#accountmanagement .abyss-public-info-action form {
  width: 132px !important;
  margin-left: auto !important;
}

#accountmanagement .abyss-register-account-action {
  width: 150px !important;
  min-width: 150px !important;
}

#accountmanagement .abyss-register-account-action form {
  width: 150px !important;
  margin-left: auto !important;
}

#accountmanagement .abyss-register-account-action .BigButton {
  width: 150px !important;
  max-width: 150px !important;
  height: 26px !important;
  background-image: linear-gradient(180deg, #0877f2 0%, #0036cc 48%, #001069 100%) !important;
}

#accountmanagement .abyss-register-account-action .BigButton > div {
  width: 100% !important;
  height: 100% !important;
  background: none !important;
  background-image: none !important;
}

#accountmanagement .abyss-register-account-action .BigButtonText {
  width: 100% !important;
  height: 26px !important;
  padding: 0 !important;
  background: transparent !important;
  color: #fff4c7 !important;
  line-height: 26px !important;
  text-align: center !important;
}

.Content .abyss-compact-button,
.Content a.abyss-compact-button,
.Content button.abyss-compact-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 116px !important;
  max-width: 180px !important;
  height: 26px !important;
  min-height: 26px !important;
  padding: 0 14px !important;
  border: 1px solid rgba(216, 168, 75, .9) !important;
  border-radius: 4px !important;
  background: linear-gradient(180deg, #0d3765 0%, #082a4e 42%, #04101d 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 232, 166, .34),
    inset 0 -2px 0 rgba(0, 0, 0, .58),
    0 0 0 1px rgba(0, 0, 0, .58),
    0 0 7px rgba(0, 168, 255, .32) !important;
  color: #fff4c7 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 26px !important;
  text-align: center !important;
  text-decoration: none !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .95) !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
  white-space: nowrap !important;
}

.Content .abyss-compact-button:hover,
.Content .abyss-compact-button:focus-visible {
  background: linear-gradient(180deg, #155080 0%, #0b3766 42%, #061827 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 232, 166, .5),
    inset 0 -2px 0 rgba(0, 0, 0, .5),
    0 0 0 1px rgba(0, 0, 0, .58),
    0 0 11px rgba(0, 190, 255, .48) !important;
  color: #fff4c7 !important;
  outline: 0 !important;
}

.Content .abyss-compact-button--danger {
  border-color: #8b2a1d !important;
  background: linear-gradient(180deg, #c94a3f 0%, #8d1510 52%, #4c0707 100%) !important;
}

.Content .abyss-caption-red,
.Content .abyss-caption-red .CaptionInnerContainer {
  background: linear-gradient(180deg, rgba(126,21,16,.98), rgba(72,8,10,.98)) !important;
  border-top: 1px solid rgba(247,214,137,.72) !important;
  border-bottom: 1px solid rgba(88,18,7,.88) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,232,166,.38),
    inset 0 -1px 0 rgba(43,9,3,.82) !important;
}

.Content .abyss-caption-red .Text {
  color: #fff4c7 !important;
  text-shadow: 0 1px 1px rgba(0,0,0,.95) !important;
}

.Content .abyss-social-register-panel {
  margin: 0 0 12px;
  border: 1px solid rgba(98, 64, 24, .38);
  background: #e2d8c4;
  box-shadow:
    inset 0 1px 0 rgba(255,244,199,.42),
    0 1px 2px rgba(0,0,0,.18);
}

.Content .abyss-social-register-caption {
  padding: 7px 12px;
  background: linear-gradient(180deg, rgba(126,21,16,.98), rgba(72,8,10,.98));
  color: #ffe19b !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 15px;
  font-weight: 900;
  line-height: 1;
  text-align: center;
  text-shadow:
    0 1px 0 rgba(38, 11, 4, .95),
    0 0 8px rgba(255, 210, 104, .38);
}

.Content .abyss-social-register-body {
  padding: 12px 14px 14px;
  border-top: 1px solid rgba(255,244,199,.35);
  color: #3f2613;
  text-align: center;
}

.Content .abyss-social-register-text {
  color: #3f2613;
  font-weight: 700;
}

.Content .abyss-social-buttons {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  justify-content: center;
  gap: 8px;
  max-width: 720px;
  margin: 12px auto 10px;
}

.Content a.abyss-social-button,
.Content .abyss-social-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 38px;
  padding: 0 16px;
  border: 1px solid rgba(63,38,19,.18);
  border-radius: 3px;
  box-sizing: border-box;
  color: #243044 !important;
  font-family: Arial, Verdana, sans-serif;
  font-size: 13px;
  font-weight: 800;
  line-height: 38px;
  text-decoration: none !important;
  text-shadow: none;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.48),
    0 1px 2px rgba(0,0,0,.22);
}

.Content .abyss-social-button:hover,
.Content .abyss-social-button:focus-visible {
  filter: brightness(1.06);
  outline: 0;
  transform: translateY(-1px);
}

.Content .abyss-social-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  font-size: 17px;
  line-height: 22px;
}

.Content .abyss-social-button--google {
  border-color: #dadce0;
  background: #ffffff;
  color: #3c4043 !important;
  text-shadow: none;
}

.Content .abyss-social-button--google .abyss-social-icon {
  color: inherit;
}

.Content .abyss-social-google-mark {
  display: block;
  width: 19px;
  height: 19px;
}

.Content .abyss-social-button--discord {
  border-color: #5865f2;
  background: #5865f2;
  color: #ffffff !important;
}

.Content .abyss-social-button--discord span,
.Content .abyss-social-button--discord i {
  color: #ffffff !important;
}

.Content .abyss-social-button--github {
  border-color: #d0d7de;
  background: #ffffff;
  color: #24292f !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.7),
    0 1px 3px rgba(27,31,36,.18);
}

.Content .abyss-social-button--twitch {
  border-color: #9146ff;
  background: #9146ff;
  color: #ffffff !important;
}

.Content .abyss-social-button--discord .abyss-social-icon,
.Content .abyss-social-button--twitch .abyss-social-icon {
  color: #ffffff;
}

.Content .abyss-social-button--github .abyss-social-icon {
  color: #000000;
}

.Content .abyss-social-divider {
  position: relative;
  margin: 12px auto 10px;
  max-width: 320px;
  color: #3f2613;
  font-weight: 900;
  text-align: center;
}

.Content .abyss-social-divider:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  background: rgba(63,38,19,.28);
}

.Content .abyss-social-divider span {
  position: relative;
  display: inline-block;
  padding: 0 10px;
  background: #e2d8c4;
}

.Content .abyss-social-message-table {
  border: 1px solid rgba(98,64,24,.38) !important;
  background: #e2d8c4 !important;
}

.Content .abyss-social-message-text {
  padding: 16px !important;
  background: #f3ead6 !important;
  color: #3f2613 !important;
  font-weight: 700;
}

.Content .abyss-social-message-text--error {
  border: 1px solid rgba(126,21,16,.62);
  background: #f1d6cf !important;
}

.Content .abyss-social-message-actions {
  padding: 12px !important;
  text-align: center;
}

@media (max-width: 720px) {
  .Content .abyss-social-buttons {
    grid-template-columns: minmax(190px, 280px);
  }
}

#accountmanagement #DowloadBox {
  min-width: 96px;
  text-align: center;
}

#accountmanagement #DowloadBox .DownloadClientImageLink,
#accountmanage #DowloadBox .DownloadClientImageLink {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#accountmanagement #DowloadBox img,
#accountmanage #DowloadBox img {
  width: 68px !important;
  height: 68px !important;
  margin: 0 2px 0 0 !important;
  image-rendering: auto;
}

#accountmanagement a {
  color: #005db8 !important;
  font-weight: 800 !important;
}

#accountmanagement a:hover {
  color: #8c180e !important;
}

#accountmanagement .SmallBox,
#accountmanagement .MessageContainer,
#accountmanagement .Message {
  border: 2px solid #2f2b25 !important;
  border-radius: 0 !important;
  background:
    linear-gradient(180deg, rgba(255, 248, 231, .98), rgba(235, 217, 180, .98)) !important;
  color: #4b2109 !important;
  box-shadow: none !important;
}

#accountmanagement .Message {
  padding: 12px !important;
}

#accountmanagement .SmallBox :is(.BoxFrameHorizontal, .BoxFrameEdgeLeftTop, .BoxFrameEdgeRightTop, .BoxFrameVerticalLeft, .BoxFrameVerticalRight, .BoxFrameEdgeRightBottom, .BoxFrameEdgeLeftBottom) {
  display: none !important;
}

#accountmanagement .TopButtonContainer {
  display: none !important;
}

#accountmanagement .InnerTableButtonRow {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 0 8px !important;
}

#accountmanagement .BigButton,
#accountmanagement .input2 {
  height: 26px !important;
  min-height: 26px !important;
  border: 1px solid #d8a84b !important;
  border-radius: 3px !important;
  background:
    linear-gradient(180deg, #0877f2 0%, #0036cc 48%, #001069 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .55),
    inset 0 -2px 0 rgba(0, 0, 0, .45),
    0 1px 0 rgba(0, 0, 0, .36) !important;
  overflow: hidden !important;
}

#accountmanagement .BigButtonOver {
  display: none !important;
}

#accountmanagement .BigButtonText {
  height: 26px !important;
  min-height: 26px !important;
  padding: 0 11px !important;
  color: #fff4c7 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 26px !important;
  text-shadow: 0 1px 0 #000 !important;
}

#accountmanagement .BigButton:hover,
#accountmanagement .BigButton:focus-within {
  filter: brightness(1.12);
}

#accountmanagement :is(input[type="text"], input[type="password"], input[type="email"], select, textarea) {
  border: 1px solid rgba(92, 61, 27, .72) !important;
  background: #fff8e8 !important;
  color: #3a210e !important;
}

.abyss-login-page {
  min-height: 560px;
  display: grid;
  place-items: center;
  padding: 34px 18px 42px;
  background:
    radial-gradient(circle at 50% 20%, rgba(216, 168, 75, .20), transparent 230px),
    linear-gradient(180deg, rgba(72, 19, 12, .28), rgba(16, 7, 4, .72));
}

.abyss-login-card {
  width: min(560px, 100%);
  padding: 0;
  border: 1px solid rgba(216, 168, 75, .78);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(39, 19, 9, .97), rgba(11, 7, 5, .98));
  box-shadow:
    0 24px 70px rgba(0, 0, 0, .48),
    inset 0 0 0 1px rgba(255, 226, 151, .16),
    inset 0 0 42px rgba(216, 168, 75, .12);
  overflow: hidden;
}

.abyss-login-card__intro {
  padding: 32px 34px 24px;
  border-bottom: 1px solid rgba(216, 168, 75, .36);
  background:
    radial-gradient(circle at 50% 0, rgba(255, 209, 116, .20), transparent 72%),
    linear-gradient(180deg, rgba(94, 24, 13, .72), rgba(34, 15, 7, .18));
  text-align: center;
}

.abyss-login-card__intro span {
  display: block;
  color: #f3c56d;
  font-family: Cinzel, Georgia, serif;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.abyss-login-card h1 {
  margin: 6px 0 10px;
  font-family: Cinzel, Georgia, serif;
  color: var(--abyss-gold-2);
  font-size: 48px;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  text-shadow:
    0 2px 0 rgba(0, 0, 0, .82),
    0 0 16px rgba(216, 168, 75, .62);
}

.abyss-login-card__intro p {
  max-width: 390px;
  margin: 0 auto;
  color: rgba(245, 224, 183, .84);
  font-size: 13px;
  line-height: 1.45;
}

.abyss-login-form,
.abyss-login-actions {
  padding: 24px 28px 0;
}

.abyss-login-form {
  display: grid;
  gap: 9px;
}

.abyss-login-label {
  display: block;
  margin: 0;
  color: #ffe19b !important;
  font-family: Cinzel, Georgia, serif;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

#accountmanagement .abyss-login-input {
  min-height: 46px;
  border: 1px solid rgba(216, 168, 75, .56) !important;
  border-radius: 6px;
  background:
    linear-gradient(180deg, rgba(24, 12, 7, .98), rgba(45, 20, 10, .96)) !important;
  color: #fff4d1 !important;
  font-size: 15px;
  box-shadow:
    inset 0 0 0 1px rgba(255, 226, 151, .10),
    inset 0 0 16px rgba(0, 0, 0, .32);
}

#accountmanagement .abyss-login-input:focus {
  border-color: rgba(255, 218, 135, .92) !important;
  box-shadow:
    0 0 0 3px rgba(216, 168, 75, .20),
    inset 0 0 0 1px rgba(255, 218, 135, .18),
    inset 0 0 16px rgba(0, 0, 0, .32);
}

.abyss-login-remember {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  width: fit-content;
  margin: 3px 0 7px;
  color: rgba(245, 232, 196, .78);
  font-size: 13px;
  cursor: pointer;
}

#accountmanagement .abyss-login-remember input {
  width: 15px !important;
  height: 15px !important;
  min-height: 0 !important;
  accent-color: #d8a84b;
}

.abyss-login-form .fantasy-button {
  min-height: 42px;
  margin-top: 2px;
}

.abyss-login-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding-bottom: 28px;
}

.abyss-login-actions form {
  margin: 0;
}

.abyss-login-actions .fantasy-button {
  min-height: 40px;
  font-size: 12px;
}

.abyss-login-error {
  padding: 10px 12px;
  border: 1px solid rgba(255, 97, 76, .52);
  border-radius: 6px;
  background: rgba(97, 12, 8, .56);
  color: #ffd7cf;
  font-size: 12px;
  line-height: 1.35;
}

.Themebox,
.discord,
.serversave,
#Themeboxes > div {
  width: 100% !important;
  height: auto !important;
  margin: 0 0 16px !important;
  color: var(--abyss-text);
  overflow: hidden;
}

#Themeboxes div {
  font-size: 13px;
}

#Themeboxes > .abyss-premium-box {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 0 16px !important;
  padding: 0 10px 12px !important;
  overflow: visible !important;
  border: 1px solid rgba(216, 168, 75, .72) !important;
  border-radius: 7px !important;
  background:
    radial-gradient(circle at 50% 0, rgba(0, 166, 255, .28), transparent 66%),
    linear-gradient(180deg, rgba(7, 29, 51, .95), rgba(1, 7, 13, .96)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(0, 166, 255, .20),
    inset 0 0 22px rgba(0, 166, 255, .12),
    0 10px 22px rgba(0, 0, 0, .34) !important;
  animation: none !important;
  isolation: auto;
}

#Themeboxes > .abyss-premium-box::before,
#Themeboxes > .abyss-premium-box::after {
  display: none !important;
}

#Themeboxes .abyss-premium-header {
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 -10px 10px;
  border-radius: 6px 6px 0 0;
  border-bottom: 1px solid rgba(0, 166, 255, .36);
  background:
    linear-gradient(180deg, rgba(12, 49, 87, .98), rgba(2, 12, 22, .95)),
    radial-gradient(circle at 50% 0, rgba(0, 166, 255, .32), transparent 60%);
  color: #ffe19b;
  font-family: Cinzel, Georgia, serif;
  font-size: 14px;
  font-weight: 800;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 0 1px 0 #000, 0 0 9px rgba(0, 166, 255, .72);
}

#Themeboxes .abyss-premium-content {
  position: relative;
  display: grid;
  justify-items: center;
  min-height: 150px;
  padding: 4px 0 2px;
  background: transparent !important;
  text-align: center;
}

#Themeboxes .abyss-premium-art-wrap {
  position: relative;
  width: 96px;
  height: 58px;
  margin-bottom: 5px;
}

#Themeboxes .abyss-premium-art {
  position: absolute;
  inset: 0;
  height: auto;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  filter: drop-shadow(0 6px 8px rgba(0, 0, 0, .55));
}

#Themeboxes .abyss-premium-decor {
  position: absolute;
  right: -9px;
  top: -5px;
  width: 34px;
  height: 34px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  filter: drop-shadow(0 0 7px rgba(255, 214, 88, .58));
}

#Themeboxes .abyss-premium-badge {
  position: static;
  min-width: 0;
  height: auto;
  margin: 0 0 4px;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

#Themeboxes .abyss-premium-box #PremiumBoxOverlayText {
  margin: 0;
  color: #6ed9ff !important;
  font-family: Inter, Verdana, Arial, sans-serif !important;
  font-size: 10px;
  font-weight: 800 !important;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 0 1px 0 #000, 0 0 7px rgba(0, 166, 255, .72) !important;
}

#Themeboxes .abyss-premium-title {
  display: block;
  max-width: 150px;
  color: #fff6cf;
  font-family: Cinzel, Georgia, serif;
  font-size: 17px;
  font-weight: 800;
  line-height: 1.05;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 0 1px 0 #000, 0 0 8px rgba(0, 166, 255, .74);
}

#Themeboxes .abyss-premium-tagline,
#Themeboxes .abyss-premium-benefit {
  position: static;
  display: block;
  max-width: 154px;
  margin: 4px 0 0;
  color: #d8ecf8;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-transform: none;
  text-shadow: 0 1px 0 #000;
}

#Themeboxes .abyss-premium-benefit {
  margin-bottom: 9px;
  color: #f3d27b;
  font-size: 10px;
  text-transform: uppercase;
}

#Themeboxes .abyss-premium-box #PremiumBoxButton {
  position: static;
  width: 100%;
  margin-top: auto;
}

#Themeboxes .abyss-premium-box #PremiumBoxButton form {
  padding: 0;
  margin: 0;
}

#Themeboxes .abyss-premium-box #PremiumBoxButton .BigButton {
  width: min(156px, 100%) !important;
  height: 34px !important;
  margin: 0 auto;
  border: 1px solid rgba(245, 185, 76, .84);
  border-radius: 4px;
  background:
    linear-gradient(180deg, rgba(9, 92, 129, .98), rgba(2, 31, 52, .98)),
    radial-gradient(circle at 50% 0, rgba(0, 166, 255, .50), transparent 70%) !important;
  box-shadow:
    inset 0 0 0 1px rgba(0, 166, 255, .32),
    inset 0 0 16px rgba(0, 166, 255, .24),
    0 0 10px rgba(0, 166, 255, .28);
}

#Themeboxes .abyss-premium-box #PremiumBoxButton .BigButtonText {
  width: 100% !important;
  height: 34px !important;
  min-height: 0;
  padding: 0 8px;
  color: #fff6cf !important;
  font-size: 12px;
  line-height: 34px;
  background: transparent !important;
  border: 0;
  box-shadow: none;
  text-shadow: 0 1px 0 #000, 0 0 8px rgba(0, 166, 255, .74);
}

.discord_header,
.serversave_header {
  color: var(--abyss-gold-2) !important;
  font-family: Cinzel, Georgia, serif !important;
  text-shadow: 0 0 10px rgba(0, 166, 255, .7) !important;
}

.discord_header {
  background: linear-gradient(180deg, rgba(14, 58, 104, .96), rgba(4, 17, 30, .98)) !important;
}

.serversave_header {
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, .8) !important;
}

.discord_content {
  background: rgba(2, 10, 18, .86) !important;
}

.serversave_content {
  background: linear-gradient(180deg, rgba(35, 7, 4, .95), rgba(5, 1, 1, .96)) !important;
}

.serversave_text,
.serversave_countdown {
  color: #fff4c7 !important;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, .8) !important;
}

.serversave_countdown {
  background: rgba(72, 8, 10, .88) !important;
  border-color: #8a1f12 !important;
  box-shadow: 0 0 10px rgba(126, 21, 16, .45) !important;
}

.serversave_bottom {
  background: linear-gradient(90deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
}

#Footer {
  margin-top: 20px;
  padding: 18px;
  color: var(--abyss-muted);
  text-align: center;
  font-size: 12px;
}

.scrollToTop { z-index: 100; }

@media (max-width: 1180px) {
  #Bodycontainer.abyss-shell {
    width: min(100% - 48px, 1040px);
  }

  .abyss-layout {
    grid-template-columns: 430px minmax(0, 1fr);
  }

  #ThemeboxesColumn {
    padding-top: 0;
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 16px;
  }
}

@media (max-width: 820px) {
  .abyss-shell {
    width: min(100% - 18px, 680px);
    padding-top: 10px;
  }

  .abyss-hero,
  .abyss-hero-content {
    min-height: 300px;
  }

  .abyss-hero {
    height: 300px;
    background-position: center top;
  }

  .abyss-topbar {
    left: auto;
    width: 100%;
    margin: 4px 0 16px;
    transform: none;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 5px;
    padding: 5px;
    aspect-ratio: auto;
    background:
      linear-gradient(180deg, rgba(7, 29, 51, .94), rgba(2, 8, 15, .96)),
      radial-gradient(circle at 50% 0, rgba(0, 166, 255, .22), transparent 70%);
    border: 1px solid var(--abyss-line);
    border-radius: var(--abyss-radius);
  }

  .abyss-layout {
    grid-template-columns: 1fr;
  }

  #MenuColumn,
  #ThemeboxesColumn {
    padding-top: 0;
  }

  .abyss-action {
    min-height: 31px;
    font-size: 11px;
    padding: 5px 7px;
  }

  .Content .Box::before {
    font-size: 20px;
  }
}

@media (max-width: 480px) {
  .abyss-topbar {
    grid-template-columns: 1fr;
  }

  .abyss-brand {
    font-size: 46px;
  }

  .abyss-tagline {
    font-size: 16px;
  }

  .abyss-login-card {
    padding: 18px;
  }
}

/* Keep the Abyssal composition stable when the browser zoom changes. */
html,
body,
#ArtworkHelper {
  min-width: var(--abyss-min-layout-width) !important;
}

#Bodycontainer.abyss-shell {
  width: min(1750px, calc(100% - 150px)) !important;
  min-width: 1420px !important;
}

.abyss-layout {
  display: grid !important;
  grid-template-columns: 430px minmax(0, 1fr) 207px !important;
  gap: 24px !important;
}

#MenuColumn,
#ThemeboxesColumn {
  padding-top: 680px !important;
}

#MenuColumn {
  padding-top: 510px !important;
}

#ThemeboxesColumn {
  padding-top: 679px !important;
  display: block !important;
  grid-column: auto !important;
}

.abyss-topbar {
  left: 50% !important;
  width: 1130px !important;
  margin: -8px 0 5px !important;
  transform: translateX(-50%) !important;
  aspect-ratio: 2132 / 200 !important;
  display: block !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: url("images/abyssal/imagegen-topbar-abyssal-v4-players-wide-goldmatch.png?v=20260530-topbar-v4") center center / 100% auto no-repeat !important;
}

/* Account/submenu layout audit: full-width, refined Abyssal content panels. */
:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
).Box {
  width: 100% !important;
  border: 1px solid rgba(216, 168, 75, .58) !important;
  border-radius: 8px !important;
  background:
    linear-gradient(180deg, rgba(7, 31, 55, .96), rgba(2, 10, 19, .97)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(0, 166, 255, .14),
    0 14px 30px rgba(0, 0, 0, .34) !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
).Box::before {
  border-bottom: 1px solid rgba(216, 168, 75, .45) !important;
  background:
    linear-gradient(180deg, rgba(10, 52, 92, .98), rgba(2, 17, 32, .98)) !important;
  color: var(--abyss-gold-2) !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) .BoxContent {
  width: 100% !important;
  padding: 14px 16px 18px !important;
  background:
    linear-gradient(180deg, rgba(255, 248, 231, .98), rgba(238, 223, 190, .98)) !important;
  color: #3a210e !important;
  overflow-x: hidden !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) :is(.TableContainer, .Table1, .Table2, .Table3, .Table4, .Table5) {
  width: 100% !important;
  margin: 0 0 10px !important;
  border: 1px solid rgba(9, 53, 90, .34) !important;
  border-radius: 6px !important;
  background: rgba(255, 252, 242, .38) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, .24),
    0 1px 0 rgba(63, 38, 10, .12) !important;
  overflow: hidden !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) :is(.CaptionContainer, .CaptionInnerContainer) {
  min-height: 34px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  padding: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(216, 168, 75, .45) !important;
  border-radius: 0 !important;
  background:
    linear-gradient(180deg, rgba(10, 52, 92, .98), rgba(2, 17, 32, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 231, 155, .20),
    inset 0 -1px 0 rgba(0, 0, 0, .42) !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) .CaptionContainer .Text {
  display: block !important;
  padding: 0 14px !important;
  color: var(--abyss-gold-2) !important;
  font-family: Cinzel, Georgia, serif !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  line-height: 34px !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 0 #000, 0 0 10px rgba(0, 166, 255, .54) !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) .CaptionContainer span {
  display: none !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) :is(.InnerTableContainer, .TableContentAndRightShadow) {
  width: 100% !important;
  padding: 5px !important;
  background: transparent !important;
  box-shadow: none !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) .TableContentContainer {
  width: 100% !important;
  border: 1px solid rgba(121, 76, 20, .18) !important;
  border-radius: 4px !important;
  background: rgba(223, 202, 162, .66) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 252, 242, .32) !important;
  overflow-x: auto !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) :is(table, .TableContent) {
  width: 100% !important;
  max-width: 100% !important;
  border-collapse: collapse !important;
  table-layout: auto !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) :is(.TableContent td, .TableContent th, td[bgcolor], th) {
  padding: 6px 8px !important;
  border-color: rgba(121, 76, 20, .20) !important;
  background: rgba(255, 250, 238, .34) !important;
  color: #3a210e !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.32 !important;
  vertical-align: middle !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) :is(.TableContent tr:nth-child(even) td, .Even) {
  background: rgba(143, 103, 40, .12) !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) :is(.LabelH td, .TableContent th, .TableContent tr:first-child td[class="white"]) {
  background:
    linear-gradient(180deg, rgba(9, 61, 105, .92), rgba(3, 24, 42, .96)) !important;
  color: var(--abyss-gold-2) !important;
  font-weight: 800 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .78) !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) :is(.LabelV, .BigBoldText, strong, b) {
  color: #5b2b06 !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) :is(.InnerTableButtonRow, form) {
  max-width: 100% !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) .BigButton {
  max-width: 100% !important;
  border: 1px solid rgba(216, 168, 75, .76) !important;
  border-radius: 4px !important;
  background:
    linear-gradient(180deg, rgba(0, 155, 235, .95), rgba(0, 65, 135, .98) 49%, rgba(0, 17, 76, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .46),
    inset 0 -2px 0 rgba(0, 0, 0, .42),
    0 0 8px rgba(0, 166, 255, .24) !important;
}

:is(
  #accountmanagement,
  #createaccount,
  #lostaccount,
  #rules,
  #downloadclient,
  #bugtracker,
  #characters,
  #online,
  #highscores,
  #lastkills,
  #houses,
  #guilds,
  #guildwar,
  #polls,
  #bans,
  #team,
  #forum,
  #creatures,
  #spells,
  #roulette,
  #gallery,
  #experienceTable,
  #currentcharactertrades,
  #pastcharactertrades,
  #ownbids,
  #owncharactertrades,
  #createcharacterauction,
  #points,
  #giftshistory
) .BigButtonText {
  color: #fff4c7 !important;
  text-shadow: 0 1px 0 #000 !important;
}

#characters .Table1 .BigButton {
  width: 72px !important;
  height: 24px !important;
  min-width: 72px !important;
  display: inline-block !important;
  overflow: hidden !important;
  border-color: rgba(216, 168, 75, .74) !important;
  background: linear-gradient(180deg, #0d3765, #04101d) !important;
  box-shadow: inset 0 0 18px rgba(0, 166, 255, .28), 0 0 18px rgba(0, 166, 255, .14) !important;
}

#characters .Table1 .BigButton:hover,
#characters .Table1 .BigButton:focus-within {
  background: linear-gradient(180deg, #0f4e91, #051726) !important;
  box-shadow: inset 0 0 22px rgba(0, 166, 255, .48), 0 0 22px rgba(0, 166, 255, .26) !important;
}

#characters .Table1 .BigButton > div {
  width: 100% !important;
  height: 100% !important;
}

#characters .Table1 .BigButtonOver {
  display: none !important;
}

#characters .Table1 .BigButtonText {
  position: static !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 12px !important;
  line-height: 24px !important;
}

#accountmanagement .abyss-account-welcome {
  display: none !important;
}

#accountmanagement .AccountStatusImage,
#accountmanagement .TopButtonContainer,
#accountmanagement .SmallBox :is(.BoxFrameHorizontal, .BoxFrameEdgeLeftTop, .BoxFrameEdgeRightTop, .BoxFrameVerticalLeft, .BoxFrameVerticalRight, .BoxFrameEdgeRightBottom, .BoxFrameEdgeLeftBottom) {
  display: none !important;
}

#accountmanagement .premiumbenefits {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  align-items: center !important;
}

#accountmanagement .premiumbenefits > div {
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  text-align: center !important;
}

#accountmanagement a[name="Account+Status"] + .TableContainer .CaptionContainer,
#accountmanagement a[name="Account+Status"] + .TableContainer .CaptionInnerContainer {
  min-height: 28px !important;
  justify-content: center !important;
  background: linear-gradient(180deg, #7a1b0b 0%, #8f2b12 48%, #6e1608 100%) !important;
  border-color: rgba(216, 168, 75, .72) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 225, 151, .45),
    inset 0 -1px 0 rgba(62, 16, 6, .82) !important;
}

#accountmanagement a[name="Account+Status"] + .TableContainer .CaptionContainer .Text {
  width: 100% !important;
  color: #fff4c7 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
  text-align: center !important;
  text-transform: none !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .85) !important;
}

/* Route-id bridge for MyAAC pages whose rendered IDs differ from their menu names. */
.Content :is(
  #accountmanage,
  #accountcreate,
  #accountlost,
  #serverInfo,
  #wars
) .BoxContent {
  width: 100% !important;
  padding: 14px 16px 18px !important;
  background:
    linear-gradient(180deg, rgba(255, 248, 231, .98), rgba(238, 223, 190, .98)) !important;
  color: #3a210e !important;
  overflow-x: hidden !important;
}

.Content :is(
  #accountmanage,
  #accountcreate,
  #accountlost,
  #serverInfo,
  #wars
) :is(.TableContainer, .Table1, .Table2, .Table3, .Table4, .Table5) {
  width: 100% !important;
  margin: 0 0 10px !important;
  border: 1px solid rgba(9, 53, 90, .34) !important;
  border-radius: 6px !important;
  background: rgba(255, 252, 242, .38) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, .24),
    0 1px 0 rgba(63, 38, 10, .12) !important;
  overflow: hidden !important;
}

.Content :is(
  #accountmanage,
  #accountcreate,
  #accountlost,
  #serverInfo,
  #wars
) :is(.CaptionContainer, .CaptionInnerContainer) {
  min-height: 34px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  padding: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(216, 168, 75, .45) !important;
  border-radius: 0 !important;
  background:
    linear-gradient(180deg, rgba(10, 52, 92, .98), rgba(2, 17, 32, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 231, 155, .20),
    inset 0 -1px 0 rgba(0, 0, 0, .42) !important;
}

.Content :is(
  #accountmanage,
  #accountcreate,
  #accountlost,
  #serverInfo,
  #wars
) .CaptionContainer .Text {
  display: block !important;
  padding: 0 14px !important;
  color: var(--abyss-gold-2) !important;
  font-family: Cinzel, Georgia, serif !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  line-height: 34px !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 0 #000, 0 0 10px rgba(0, 166, 255, .54) !important;
}

.Content :is(
  #accountmanage,
  #accountcreate,
  #accountlost,
  #serverInfo,
  #wars
) .CaptionContainer span {
  display: none !important;
}

.Content :is(
  #accountmanage,
  #accountcreate,
  #accountlost,
  #serverInfo,
  #wars
) :is(.InnerTableContainer, .TableContentAndRightShadow) {
  width: 100% !important;
  padding: 5px !important;
  background: transparent !important;
  box-shadow: none !important;
}

.Content :is(
  #accountmanage,
  #accountcreate,
  #accountlost,
  #serverInfo,
  #wars
) .TableContentContainer {
  width: 100% !important;
  border: 1px solid rgba(121, 76, 20, .18) !important;
  border-radius: 4px !important;
  background: rgba(223, 202, 162, .66) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 252, 242, .32) !important;
  overflow-x: auto !important;
}

.Content :is(
  #accountmanage,
  #accountcreate,
  #accountlost,
  #serverInfo,
  #wars
) :is(table, .TableContent) {
  width: 100% !important;
  max-width: 100% !important;
  border-collapse: collapse !important;
  table-layout: auto !important;
}

.Content :is(
  #accountmanage,
  #accountcreate,
  #accountlost,
  #serverInfo,
  #wars
) :is(.TableContent td, .TableContent th, td[bgcolor], th) {
  padding: 6px 8px !important;
  border-color: rgba(121, 76, 20, .20) !important;
  background: rgba(255, 250, 238, .34) !important;
  color: #3a210e !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.32 !important;
  vertical-align: middle !important;
  overflow-wrap: anywhere !important;
}

.Content :is(
  #accountmanage,
  #accountcreate,
  #accountlost,
  #serverInfo,
  #wars
) :is(.LabelH td, .TableContent th, .TableContent tr:first-child td[class="white"]) {
  background:
    linear-gradient(180deg, rgba(9, 61, 105, .92), rgba(3, 24, 42, .96)) !important;
  color: var(--abyss-gold-2) !important;
  font-weight: 800 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .78) !important;
}

.Content :is(
  #accountmanage,
  #accountcreate,
  #accountlost,
  #serverInfo,
  #wars
) :is(input[type="text"], input[type="password"], input[type="email"], select, textarea) {
  min-height: 38px !important;
  border: 1px solid rgba(92, 61, 27, .48) !important;
  border-radius: 6px !important;
  background: #fff8e8 !important;
  color: #3a210e !important;
}

#createaccount .CaptionContainer,
#createaccount .CaptionInnerContainer,
#accountcreate .CaptionContainer,
#accountcreate .CaptionInnerContainer,
#accountmanage .CaptionContainer,
#accountmanage .CaptionInnerContainer,
#accountlost .CaptionContainer,
#accountlost .CaptionInnerContainer {
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  border-top: 1px solid rgba(247, 214, 137, .72) !important;
  border-bottom: 1px solid rgba(88, 18, 7, .88) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 232, 166, .38),
    inset 0 -1px 0 rgba(43, 9, 3, .82) !important;
}

#createaccount input[type="text"],
#createaccount input[type="password"],
#createaccount input[type="email"],
#createaccount select,
#createaccount textarea,
#accountmanage input[type="text"],
#accountmanage input[type="password"],
#accountmanage input[type="email"],
#accountmanage select,
#accountmanage textarea,
#accountlost input[type="text"],
#accountlost input[type="password"],
#accountlost input[type="email"],
#accountlost select,
#accountlost textarea {
  background: #fff8e8 !important;
  color: #3a210e !important;
}

.Content .Box:not(#NewsTicker):not(#newsticker):not(#FeaturedArticle):not(#news):not(#eventcalendar) :is(.CaptionContainer, .CaptionInnerContainer) {
  background: linear-gradient(180deg, rgba(10, 52, 92, .98), rgba(2, 17, 32, .98)) !important;
  border-bottom: 1px solid rgba(216, 168, 75, .45) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 231, 155, .20),
    inset 0 -1px 0 rgba(0, 0, 0, .42) !important;
}

.Content .Box:not(#NewsTicker):not(#newsticker):not(#FeaturedArticle):not(#news):not(#eventcalendar) .CaptionContainer .Text {
  color: var(--abyss-gold-2) !important;
  font-family: Cinzel, Georgia, serif !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 0 #000, 0 0 10px rgba(0, 166, 255, .54) !important;
}

#accountmanagement .CaptionContainer,
#accountmanagement .CaptionInnerContainer {
  background: linear-gradient(180deg, #0A345C 0%, #061F37 52%, #021120 100%) !important;
  border-bottom: 1px solid rgba(216, 168, 75, .55) !important;
  box-shadow: inset 0 0 18px rgba(255, 196, 92, .18) !important;
}

#accountmanagement .CaptionContainer .Text {
  color: #fff4c7 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, .8) !important;
}

#accountmanagement .LabelH td,
#accountmanagement .TableContent th {
  background: linear-gradient(180deg, #0A345C 0%, #061F37 52%, #021120 100%) !important;
  color: #fff4c7 !important;
  font-weight: 800 !important;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, .8) !important;
}

/* Ultra-thin borders for account and submenu content. Keep News untouched. */
.Content .Box:not(#NewsTicker):not(#newsticker):not(#FeaturedArticle):not(#news):not(#eventcalendar) {
  border-width: 1px !important;
  box-shadow: 0 8px 18px rgba(0, 0, 0, .22) !important;
}

.Content .Box:not(#NewsTicker):not(#newsticker):not(#FeaturedArticle):not(#news):not(#eventcalendar) .BoxContent {
  padding: 10px 12px 14px !important;
}

.Content .Box:not(#NewsTicker):not(#newsticker):not(#FeaturedArticle):not(#news):not(#eventcalendar) :is(.TableContainer, .Table1, .Table2, .Table3, .Table4, .Table5) {
  margin: 0 0 8px !important;
  border: 1px solid rgba(9, 53, 90, .22) !important;
  border-radius: 4px !important;
  background: rgba(255, 252, 242, .18) !important;
  box-shadow: none !important;
}

.Content .Box:not(#NewsTicker):not(#newsticker):not(#FeaturedArticle):not(#news):not(#eventcalendar) :is(.InnerTableContainer, .TableContentAndRightShadow) {
  padding: 2px !important;
  background: transparent !important;
  box-shadow: none !important;
}

.Content .Box:not(#NewsTicker):not(#newsticker):not(#FeaturedArticle):not(#news):not(#eventcalendar) .TableContentContainer {
  border: 1px solid rgba(121, 76, 20, .14) !important;
  border-radius: 3px !important;
  background: rgba(223, 202, 162, .54) !important;
  box-shadow: none !important;
}

.Content .Box:not(#NewsTicker):not(#newsticker):not(#FeaturedArticle):not(#news):not(#eventcalendar) :is(.CaptionContainer, .CaptionInnerContainer) {
  border-bottom: 1px solid rgba(216, 168, 75, .32) !important;
  box-shadow: none !important;
}

/* Final thin-frame pass for every non-News submenu panel. */
.Content .Box:not(#NewsTicker):not(#newsticker):not(#FeaturedArticle):not(#news):not(#eventcalendar) {
  border: 1px solid rgba(216, 168, 75, .36) !important;
  box-shadow: none !important;
}

.Content .Box:not(#NewsTicker):not(#newsticker):not(#FeaturedArticle):not(#news):not(#eventcalendar)::before {
  border-bottom: 1px solid rgba(216, 168, 75, .30) !important;
}

.Content .Box:not(#NewsTicker):not(#newsticker):not(#FeaturedArticle):not(#news):not(#eventcalendar) .BoxContent {
  padding: 8px 10px 10px !important;
}

.Content .Box:not(#NewsTicker):not(#newsticker):not(#FeaturedArticle):not(#news):not(#eventcalendar) :is(
  .TableContainer,
  .Table1,
  .Table2,
  .Table3,
  .Table4,
  .Table5,
  .SmallBox,
  .MessageContainer,
  .Message
) {
  margin: 0 0 6px !important;
  border: 1px solid rgba(9, 53, 90, .16) !important;
  border-radius: 3px !important;
  background: transparent !important;
  box-shadow: none !important;
}

.Content .Box:not(#NewsTicker):not(#newsticker):not(#FeaturedArticle):not(#news):not(#eventcalendar) :is(
  .InnerTableContainer,
  .TableContentAndRightShadow,
  .TableShadowContainerRightTop,
  .TableShadowContainer,
  .TableShadowRightTop,
  .TableBottomShadow,
  .TableBottomLeftShadow,
  .TableBottomRightShadow
) {
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.Content .Box:not(#NewsTicker):not(#newsticker):not(#FeaturedArticle):not(#news):not(#eventcalendar) .TableContentContainer {
  border: 1px solid rgba(121, 76, 20, .10) !important;
  border-radius: 2px !important;
  background: rgba(223, 202, 162, .48) !important;
  box-shadow: none !important;
}

.Content .Box:not(#NewsTicker):not(#newsticker):not(#FeaturedArticle):not(#news):not(#eventcalendar) :is(.CaptionContainer, .CaptionInnerContainer) {
  min-height: 30px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(216, 168, 75, .24) !important;
  border-radius: 2px 2px 0 0 !important;
  box-shadow: none !important;
}

.Content .Box:not(#NewsTicker):not(#newsticker):not(#FeaturedArticle):not(#news):not(#eventcalendar) .CaptionContainer .Text {
  line-height: 30px !important;
}

#accountmanage .AccountStatusActions,
#accountmanagement .AccountStatusActions {
  width: 132px !important;
  min-width: 132px !important;
  padding-left: 8px !important;
  text-align: right !important;
  white-space: nowrap !important;
}

#accountmanage .AccountStatusActions > a,
#accountmanagement .AccountStatusActions > a {
  display: block !important;
  width: 132px !important;
  height: 25px !important;
  margin: 0 0 4px auto !important;
}

#accountmanage .AccountStatusActions form,
#accountmanagement .AccountStatusActions form {
  display: block !important;
  width: 132px !important;
  height: 25px !important;
  margin: 0 0 0 auto !important;
  padding: 0 !important;
}

#accountmanage .AccountStatusActions .BigButton,
#accountmanagement .AccountStatusActions .BigButton {
  width: 132px !important;
  height: 25px !important;
  min-height: 25px !important;
  border: 1px solid #3b2300 !important;
  border-radius: 3px !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 235, 124, .86),
    inset 0 2px 0 rgba(255, 255, 255, .34),
    inset 0 -2px 0 rgba(0, 0, 0, .42),
    0 1px 0 rgba(255, 224, 92, .48) !important;
  overflow: hidden !important;
}

#accountmanage .AccountStatusActions > a .BigButton,
#accountmanagement .AccountStatusActions > a .BigButton {
  background:
    linear-gradient(180deg, #67ec20 0%, #19a000 42%, #064f00 100%) !important;
}

#accountmanage .AccountStatusActions form .BigButton,
#accountmanagement .AccountStatusActions form .BigButton {
  background:
    linear-gradient(180deg, #ff5b5b 0%, #d10000 42%, #640000 100%) !important;
}

#accountmanage .AccountStatusActions .BigButton > div,
#accountmanagement .AccountStatusActions .BigButton > div {
  height: 100% !important;
}

#accountmanage .AccountStatusActions .BigButtonOver,
#accountmanagement .AccountStatusActions .BigButtonOver {
  display: none !important;
}

#accountmanage .AccountStatusActions .BigButtonText,
#accountmanagement .AccountStatusActions .BigButtonText {
  width: 100% !important;
  height: 23px !important;
  min-height: 23px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #fff7c7 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 23px !important;
  text-align: center !important;
  text-transform: none !important;
  text-shadow:
    1px 1px 0 #000,
    -1px 1px 0 #000,
    1px -1px 0 #000,
    -1px -1px 0 #000 !important;
  cursor: pointer !important;
}

.abyss-info-page,
.abyss-experience-page {
  color: #3f2613;
  font-family: Verdana, Arial, sans-serif;
}

.abyss-info-hero {
  min-height: 138px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  padding: 18px 20px;
  border: 1px solid #5c2b17;
  background: linear-gradient(180deg, rgba(126,21,16,.98), rgba(72,8,10,.98));
  box-shadow:
    inset 0 0 0 1px rgba(255, 244, 199, .18),
    0 2px 5px rgba(0, 0, 0, .28);
}

.abyss-info-hero span,
.abyss-info-section header span {
  display: block;
  color: #fff4c7;
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  text-shadow: 1px 1px 1px #210303;
}

.abyss-info-hero h1,
.abyss-info-section h2 {
  margin: 4px 0 8px;
  color: #fff4c7;
  font-family: Verdana, Arial, sans-serif;
  line-height: 1;
  text-shadow: 1px 1px 1px #210303;
}

.abyss-info-hero h1 {
  font-size: 34px;
}

.abyss-info-section h2 {
  font-size: 24px;
}

.abyss-info-hero p {
  max-width: 620px;
  margin: 0;
  color: #fff4c7;
  font-size: 14px;
  line-height: 1.5;
  text-shadow: 1px 1px 1px #210303;
}

.abyss-info-hero .fantasy-button {
  width: 148px;
}

.abyss-info-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
}

.abyss-info-stat {
  min-height: 92px;
  padding: 15px;
  border: 1px solid #c7b487;
  background: #e2d8c4;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, .32),
    0 1px 2px rgba(0, 0, 0, .18);
}

.abyss-info-stat small {
  display: block;
  margin-bottom: 8px;
  color: #3f2613;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.abyss-info-stat strong {
  color: #2f1c0d;
  font-family: Verdana, Arial, sans-serif;
  font-size: 18px;
  line-height: 1.2;
}

.abyss-info-section {
  margin-top: 16px;
  padding: 0 0 14px;
  border: 1px solid #c7b487;
  background: #e2d8c4;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, .32),
    0 1px 2px rgba(0, 0, 0, .18);
}

.abyss-info-section > header {
  margin: 0 0 12px;
  padding: 10px 14px;
  background: linear-gradient(180deg, rgba(126,21,16,.98), rgba(72,8,10,.98));
  border-bottom: 1px solid #5c2b17;
}

.abyss-rate-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, .9fr) minmax(0, .9fr);
  gap: 12px;
  padding: 0 14px;
}

.abyss-rate-card {
  overflow: hidden;
  border: 1px solid #c7b487;
  background: #e2d8c4;
}

.abyss-rate-card h3 {
  margin: 0;
  padding: 9px 12px;
  color: #fff4c7;
  font-family: Verdana, Arial, sans-serif;
  font-size: 13px;
  background: linear-gradient(180deg, rgba(126,21,16,.98), rgba(72,8,10,.98));
  text-shadow: 1px 1px 1px #210303;
}

.abyss-rate-card table,
.abyss-experience-table {
  width: 100%;
  border-collapse: collapse;
}

.abyss-rate-card th,
.abyss-rate-card td,
.abyss-experience-table th,
.abyss-experience-table td {
  padding: 8px 10px;
  border-top: 1px solid #c7b487;
  color: #3f2613;
  font-size: 12px;
  text-align: left;
}

.abyss-rate-card th,
.abyss-experience-table th {
  color: #fff4c7;
  background: linear-gradient(180deg, rgba(126,21,16,.98), rgba(72,8,10,.98));
  font-size: 11px;
  text-transform: uppercase;
  text-shadow: 1px 1px 1px #210303;
}

.abyss-rate-card tbody tr:nth-child(odd),
.abyss-rate-card tbody tr.Odd,
.abyss-experience-table tbody tr:nth-child(odd) {
  background: #f3ead6;
}

.abyss-rate-card tbody tr:nth-child(even),
.abyss-rate-card tbody tr.Even,
.abyss-experience-table tbody tr:nth-child(even) {
  background: #e7dcc4;
}

.abyss-rate-card td:last-child,
.abyss-experience-table td:last-child {
  color: #3f2613;
  font-weight: 700;
}

.abyss-info-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.abyss-info-list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0 14px;
  list-style: none;
}

.abyss-info-list li,
.abyss-command-list div {
  padding: 11px 12px;
  border: 1px solid #c7b487;
  background: #f3ead6;
  color: #3f2613;
  font-size: 12px;
  line-height: 1.45;
}

.abyss-command-list {
  display: grid;
  gap: 10px;
  padding: 0 14px;
}

.abyss-command-list div {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
}

.abyss-command-list code {
  color: #3f2613;
  font-family: Consolas, "Courier New", monospace;
  font-size: 12px;
  font-weight: 700;
}

.abyss-experience-summary {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.abyss-experience-frame {
  display: grid;
  grid-template-columns: repeat(4, minmax(190px, 1fr));
  gap: 12px;
  margin-top: 16px;
  overflow-x: auto;
}

.abyss-experience-table {
  min-width: 190px;
  border: 1px solid rgba(216, 168, 75, .32);
  background: rgba(4, 12, 22, .76);
}

.abyss-experience-table caption {
  padding: 12px;
  color: #ffe7a4;
  font-family: Cinzel, Georgia, serif;
  font-size: 15px;
  font-weight: 800;
  text-align: left;
  background: rgba(216, 168, 75, .12);
}

.abyss-experience-table td:first-child {
  color: #f5e8c4;
  font-weight: 700;
}

@media (max-width: 980px) {
  .abyss-info-hero,
  .abyss-info-columns {
    grid-template-columns: 1fr;
  }

  .abyss-info-grid,
  .abyss-rate-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .abyss-experience-frame {
    grid-template-columns: repeat(2, minmax(190px, 1fr));
  }
}

@media (max-width: 620px) {
  .abyss-info-hero {
    padding: 18px;
  }

  .abyss-info-hero h1 {
    font-size: 28px;
  }

  .abyss-info-grid,
  .abyss-rate-grid,
  .abyss-experience-summary,
  .abyss-experience-frame {
    grid-template-columns: 1fr;
  }

  .abyss-command-list div {
    grid-template-columns: 1fr;
  }
}

/* Account login follows the same parchment/red headline pattern as News Archive. */
.Content #accountmanagement.Box::before {
  min-height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 12px;
  border: 1px solid rgba(216, 168, 75, .55);
  border-bottom: 0;
  background: linear-gradient(180deg, #0A345C 0%, #061F37 52%, #021120 100%) !important;
  color: #fff4c7 !important;
  font-family: Verdana, Arial, sans-serif;
  font-size: 14px;
  font-weight: 800;
  line-height: 1;
  text-align: center;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, .8);
  box-shadow: inset 0 0 18px rgba(255, 196, 92, .18);
}

.Content #accountmanagement.Box > .Border_2 > .Border_3 > .BoxContent {
  padding: 0 !important;
  border: 1px solid rgba(121, 76, 20, .36);
  border-top: 0;
  background:
    linear-gradient(rgba(255, 252, 242, .88), rgba(255, 248, 226, .82)),
    var(--abyss-scroll) !important;
  color: #3a210e !important;
}

#accountmanagement .abyss-login-page {
  min-height: 520px;
  padding: 42px 18px 48px;
  background: transparent !important;
}

#accountmanagement .abyss-login-card {
  width: min(560px, 100%);
  border: 1px solid rgba(121, 76, 20, .42);
  border-radius: 0;
  background:
    linear-gradient(rgba(255, 252, 242, .92), rgba(255, 248, 226, .88)),
    var(--abyss-scroll) !important;
  box-shadow: 0 10px 18px rgba(85, 48, 12, .18);
}

#accountmanagement .abyss-login-card__intro {
  padding: 18px 28px 16px;
  border-bottom: 1px solid rgba(121, 76, 20, .36);
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
}

#accountmanagement .abyss-login-card__intro span {
  color: #f5d991;
  font-family: Verdana, Arial, sans-serif;
  font-size: 11px;
}

#accountmanagement .abyss-login-card h1 {
  margin: 4px 0 7px;
  color: #fff4c7;
  font-family: Cinzel, Georgia, serif;
  font-size: 40px;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, .82);
}

#accountmanagement .abyss-login-card__intro p {
  color: #f3e3b8;
}

#accountmanagement .abyss-login-form,
#accountmanagement .abyss-login-actions {
  padding-left: 28px;
  padding-right: 28px;
}

#accountmanagement .abyss-login-label {
  color: #5b2b06 !important;
  font-family: Verdana, Arial, sans-serif;
}

#accountmanagement .abyss-login-input {
  border: 1px solid rgba(121, 76, 20, .58) !important;
  background: #fff8e8 !important;
  color: #3a210e !important;
  box-shadow:
    inset 0 1px 4px rgba(92, 51, 15, .16),
    0 0 0 1px rgba(255, 255, 255, .42);
}

#accountmanagement .abyss-login-input:focus {
  border-color: rgba(126, 21, 16, .74) !important;
  box-shadow:
    0 0 0 3px rgba(126, 21, 16, .15),
    inset 0 1px 4px rgba(92, 51, 15, .16);
}

#accountmanagement .abyss-login-remember {
  color: #5b2b06;
}

#accountmanagement .abyss-login-form .fantasy-button,
#accountmanagement .abyss-login-actions .fantasy-button {
  border-color: rgba(121, 76, 20, .72);
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98));
  color: #fff4c7 !important;
  box-shadow: inset 0 0 12px rgba(255, 196, 92, .18);
}

#accountmanagement .LabelH td,
#accountmanagement .TableContent th,
#accountmanage .LabelH td,
#accountmanage .TableContent th {
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
}

.Content #accountmanagement.Box::before {
  background: linear-gradient(180deg, #0A345C 0%, #061F37 52%, #021120 100%) !important;
}

.Content #accountmanage.Box::before {
  background: linear-gradient(180deg, #0A345C 0%, #061F37 52%, #021120 100%) !important;
}

#accountmanagement .CaptionContainer,
#accountmanagement .CaptionInnerContainer,
#accountmanage .CaptionContainer,
#accountmanage .CaptionInnerContainer {
  min-height: 30px !important;
  background: linear-gradient(180deg, #0A345C 0%, #061F37 52%, #021120 100%) !important;
  background-image: linear-gradient(180deg, #0A345C 0%, #061F37 52%, #021120 100%) !important;
  border-bottom: 1px solid rgba(216, 168, 75, .45) !important;
  box-shadow: inset 0 0 18px rgba(255, 196, 92, .12) !important;
}

#accountmanagement .CaptionContainer .Text,
#accountmanage .CaptionContainer .Text {
  position: static !important;
  width: auto !important;
  height: auto !important;
  display: block !important;
  padding: 0 14px !important;
  background: transparent !important;
  color: #fff4c7 !important;
  line-height: 30px !important;
  box-sizing: border-box !important;
}

.Content #accountmanage.Box > .Border_2 > .Border_3 > .BoxContent,
.Content #accountmanagement.Box > .Border_2 > .Border_3 > .BoxContent {
  padding: 14px !important;
  background:
    linear-gradient(rgba(255, 252, 242, .90), rgba(255, 248, 226, .86)),
    var(--abyss-scroll) !important;
  color: #3a210e !important;
}

#accountmanage .TableContainer,
#accountmanagement .TableContainer,
#accountmanage :is(.Table3, .Table5),
#accountmanagement :is(.Table3, .Table5) {
  margin: 0 0 18px !important;
  border: 1px solid rgba(121, 76, 20, .36) !important;
  background: rgba(255, 252, 242, .42) !important;
}

#accountmanage .TableContentContainer,
#accountmanagement .TableContentContainer {
  border: 1px solid rgba(121, 76, 20, .24) !important;
  background: #efe3c4 !important;
}

/* Account Management rendered in the same block language as News pages. */
.abyss-account-newsstyle {
  display: block;
}

.abyss-account-newsstyle > div:first-child,
.abyss-account-newsstyle > .TopButtonContainer,
.abyss-account-newsstyle > br {
  display: none !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle > .TableContainer,
.Content .Box .BoxContent .abyss-account-newsstyle > .SmallBox {
  margin: 0 0 18px !important;
  overflow: hidden !important;
  border: 1px solid rgba(216, 168, 75, .46) !important;
  border-radius: 7px !important;
  background:
    linear-gradient(180deg, rgba(255, 246, 224, .97), rgba(239, 222, 187, .97)) !important;
  color: #3a210e !important;
  box-shadow: none !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle > .TableContainer .CaptionContainer,
.Content .Box .BoxContent .abyss-account-newsstyle > .TableContainer .CaptionContainer > .CaptionInnerContainer {
  min-height: 48px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  padding: 0 18px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(216, 168, 75, .46) !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, rgba(13, 55, 101, .95), rgba(4, 16, 29, .96)) !important;
  box-shadow: inset 0 0 18px rgba(0, 166, 255, .20) !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle > .TableContainer .CaptionContainer span {
  display: none !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle > .TableContainer .CaptionContainer .Text {
  position: static !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  background: transparent !important;
  color: var(--abyss-gold-2) !important;
  font-family: Cinzel, Georgia, serif !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  text-shadow: 0 0 14px rgba(0, 166, 255, .62) !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle > .TableContainer > table,
.Content .Box .BoxContent .abyss-account-newsstyle > .TableContainer :is(.Table3, .Table5) {
  width: 100% !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle :is(.InnerTableContainer, .TableContentAndRightShadow, .TableContent) {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle .TableContentContainer,
.Content .Box .BoxContent .abyss-account-newsstyle .Message {
  margin: 0 !important;
  padding: 12px 14px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background:
    linear-gradient(rgba(255, 252, 242, .88), rgba(255, 248, 226, .82)),
    var(--abyss-scroll) !important;
  color: #3a210e !important;
  box-shadow: none !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle .TableContentContainer + .TableContentContainer {
  border-top: 1px solid rgba(121, 76, 20, .24) !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle .TableContent {
  border-collapse: collapse !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle .TableContent td,
.Content .Box .BoxContent .abyss-account-newsstyle .TableContent th {
  padding: 8px 10px !important;
  border-color: rgba(121, 76, 20, .18) !important;
  color: #3a210e !important;
  font-family: Inter, Verdana, Arial, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle .TableContent tr:nth-child(odd) td {
  background: rgba(123, 86, 28, .12) !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle .TableContent tr:nth-child(even) td {
  background: rgba(255, 252, 242, .42) !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle .TableContent .LabelH td,
.Content .Box .BoxContent .abyss-account-newsstyle .TableContent th {
  min-height: 30px !important;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  color: #fff4c7 !important;
  font-weight: 800 !important;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, .8) !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle .LabelV {
  width: 150px !important;
  color: #3f2613 !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
  text-shadow: 0 1px 0 rgba(255, 242, 205, .42) !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle .SmallBox :is(.BoxFrameHorizontal, .BoxFrameEdgeLeftTop, .BoxFrameEdgeRightTop, .BoxFrameVerticalLeft, .BoxFrameVerticalRight, .BoxFrameEdgeRightBottom, .BoxFrameEdgeLeftBottom) {
  display: none !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle .MessageContainer {
  border: 0 !important;
  background: transparent !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle {
  --account-beige-light: #f3ead6;
  --account-beige-soft: #e7dcc4;
}

.Content .Box .BoxContent .abyss-account-newsstyle .TableContentContainer,
.Content .Box .BoxContent .abyss-account-newsstyle .Message,
.Content .Box .BoxContent .abyss-account-newsstyle .TableContent {
  background: var(--account-beige-light) !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle .TableContent tr,
.Content .Box .BoxContent .abyss-account-newsstyle .TableContent tr[style],
.Content .Box .BoxContent .abyss-account-newsstyle .TableContent tr[bgcolor] {
  background: transparent !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle .TableContent tr:nth-child(odd) > td,
.Content .Box .BoxContent .abyss-account-newsstyle .TableContent tr:nth-child(odd) > th {
  background: var(--account-beige-soft) !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle .TableContent tr:nth-child(even) > td,
.Content .Box .BoxContent .abyss-account-newsstyle .TableContent tr:nth-child(even) > th {
  background: var(--account-beige-light) !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle .TableContent .LabelH > td,
.Content .Box .BoxContent .abyss-account-newsstyle .TableContent th {
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle .CaptionContainer.abyss-caption-newsref,
.Content .Box .BoxContent .abyss-account-newsstyle .CaptionContainer.abyss-caption-newsref > .CaptionInnerContainer,
#accountmanagement .CaptionContainer.abyss-caption-newsref,
#accountmanagement .CaptionContainer.abyss-caption-newsref > .CaptionInnerContainer {
  min-height: 28px !important;
  justify-content: center !important;
  padding: 0 !important;
  border-top: 1px solid rgba(247, 214, 137, .72) !important;
  border-bottom: 1px solid rgba(88, 18, 7, .88) !important;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 232, 166, .38),
    inset 0 -1px 0 rgba(43, 9, 3, .82) !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle .CaptionContainer.abyss-caption-newsref .Text,
#accountmanagement .CaptionContainer.abyss-caption-newsref .Text {
  width: 100% !important;
  color: #fff4c7 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
  text-align: center !important;
  text-transform: none !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle > .TableContainer,
.Content .Box .BoxContent .abyss-account-newsstyle > .TableContainer > table,
.Content .Box .BoxContent .abyss-account-newsstyle > .TableContainer :is(.Table3, .Table5),
.Content .Box .BoxContent .abyss-account-newsstyle :is(.InnerTableContainer, .TableContentAndRightShadow),
.Content .Box .BoxContent .abyss-account-newsstyle > .TableContainer > table > tbody > tr > td,
.Content .Box .BoxContent .abyss-account-newsstyle .InnerTableContainer > table > tbody > tr > td {
  background: #e2d8c4 !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle > .TableContainer {
  border-color: rgba(168, 151, 121, .72) !important;
}

.Content .Box .BoxContent .abyss-account-newsstyle .TableContentContainer {
  background: #e2d8c4 !important;
}

#accountmanagement .abyss-register-page {
  color: #3a210e !important;
}

#accountmanagement .abyss-register-intro {
  margin: 0 0 12px !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(168, 151, 121, .72) !important;
  color: #3a210e !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}

#accountmanagement .abyss-register-page .TableContainer,
#accountmanagement .abyss-register-page .Table1,
#accountmanagement .abyss-register-page .InnerTableContainer,
#accountmanagement .abyss-register-page .TableContentContainer {
  background: #e2d8c4 !important;
  border-color: rgba(168, 151, 121, .72) !important;
  box-shadow: none !important;
}

#accountmanagement .abyss-register-page .TableContent td {
  padding: 7px 8px !important;
  border-color: rgba(168, 151, 121, .28) !important;
  color: #3a210e !important;
}

#accountmanagement .abyss-register-input {
  width: min(560px, 100%) !important;
  height: 34px !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(92, 61, 27, .72) !important;
  border-radius: 3px !important;
  background: #fff8e8 !important;
  color: #3a210e !important;
  padding: 6px 8px !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 13px !important;
  box-shadow: inset 0 1px 3px rgba(92, 51, 15, .16) !important;
}

#accountmanagement .abyss-register-input--short {
  width: min(220px, 100%) !important;
}

#accountmanagement .abyss-register-input--cep {
  width: min(180px, 100%) !important;
}

#accountmanagement .abyss-register-input--code {
  width: min(120px, 100%) !important;
}

#accountmanagement .abyss-phone-row {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

#accountmanagement .abyss-inline-button {
  min-width: 128px !important;
  height: 28px !important;
  border: 1px solid #f3c55f !important;
  border-radius: 4px !important;
  background: linear-gradient(180deg, #06466f, #002744) !important;
  color: #fff4c7 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 0 #000 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .2),
    0 0 6px rgba(0, 175, 255, .3) !important;
  cursor: pointer !important;
}

#accountmanagement .abyss-inline-button:hover:not(:disabled) {
  background: linear-gradient(180deg, #0a74ad, #003d66) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .32),
    0 0 10px rgba(0, 175, 255, .52) !important;
}

#accountmanagement .abyss-inline-button:disabled {
  cursor: default !important;
  opacity: .72 !important;
}

#accountmanagement .abyss-cep-status {
  display: inline-block !important;
  margin-left: 10px !important;
  color: #3f2613 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  vertical-align: middle !important;
}

#accountmanagement .abyss-cep-status.is-loading {
  color: #6a4a10 !important;
}

#accountmanagement .abyss-cep-status.is-ok {
  color: #1f681f !important;
}

#accountmanagement .abyss-cep-status.is-error {
  color: #8a1b13 !important;
}

#accountmanagement .abyss-phone-status,
#accountmanagement .abyss-phone-hint {
  display: inline-block !important;
  color: #3f2613 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  vertical-align: middle !important;
}

#accountmanagement .abyss-phone-status.is-loading {
  color: #6a4a10 !important;
}

#accountmanagement .abyss-phone-status.is-ok {
  color: #1f681f !important;
}

#accountmanagement .abyss-phone-status.is-error {
  color: #8a1b13 !important;
}

#accountmanagement .abyss-register-input:focus {
  outline: 0 !important;
  border-color: rgba(126, 21, 16, .74) !important;
  box-shadow:
    0 0 0 2px rgba(126, 21, 16, .16),
    inset 0 1px 3px rgba(92, 51, 15, .16) !important;
}

#accountmanagement .abyss-register-actions-row {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 8px 0 0 !important;
  padding: 0 !important;
}

#accountmanagement .abyss-register-actions,
#accountmanagement .abyss-register-back {
  display: inline-flex !important;
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: top !important;
}

#accountmanagement .abyss-register-page .BigButton,
#accountmanagement .abyss-register-page .BigButtonText {
  width: 132px !important;
}

#accountmanagement .abyss-error-box,
#accountmanage .abyss-error-box {
  margin: 0 0 12px !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(126, 21, 16, .78) !important;
  border-radius: 0 !important;
  background: #f3ead6 !important;
  color: #3a210e !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 252, 242, .42),
    0 1px 0 rgba(0, 0, 0, .22) !important;
}

#accountmanagement .abyss-error-box__title,
#accountmanage .abyss-error-box__title {
  margin: 0 0 6px !important;
  padding: 0 0 6px !important;
  border-bottom: 1px solid rgba(126, 21, 16, .24) !important;
  color: #7e1510 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 900 !important;
}

#accountmanagement .abyss-error-box__list,
#accountmanage .abyss-error-box__list {
  margin: 0 !important;
  padding-left: 18px !important;
  color: #3f2613 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
}

#accountmanagement .abyss-error-box__list li,
#accountmanage .abyss-error-box__list li {
  margin: 2px 0 !important;
}

#accountmanagement .abyss-create-character-page {
  color: #3a210e !important;
}

#accountmanagement .abyss-create-intro {
  margin: 0 0 12px !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(168, 151, 121, .72) !important;
  color: #3a210e !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}

#accountmanagement .abyss-create-warning {
  color: #8a1b13 !important;
}

#accountmanagement .abyss-create-character-page .TableContainer,
#accountmanagement .abyss-create-character-page .Table1,
#accountmanagement .abyss-create-character-page .InnerTableContainer,
#accountmanagement .abyss-create-character-page .TableContentContainer {
  background: #e2d8c4 !important;
  border-color: rgba(168, 151, 121, .72) !important;
  box-shadow: none !important;
}

#accountmanagement .abyss-create-section {
  margin-top: 12px !important;
}

#accountmanagement .abyss-create-table td {
  padding: 8px 10px !important;
  border-color: rgba(168, 151, 121, .28) !important;
  color: #3a210e !important;
}

#accountmanagement .abyss-create-input {
  width: min(360px, 100%) !important;
  height: 32px !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(92, 61, 27, .72) !important;
  border-radius: 3px !important;
  background: #fff8e8 !important;
  color: #3a210e !important;
  padding: 6px 8px !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 13px !important;
  box-shadow: inset 0 1px 3px rgba(92, 51, 15, .16) !important;
}

#accountmanagement .abyss-create-input:focus {
  outline: 0 !important;
  border-color: rgba(126, 21, 16, .74) !important;
  box-shadow:
    0 0 0 2px rgba(126, 21, 16, .16),
    inset 0 1px 3px rgba(92, 51, 15, .16) !important;
}

#accountmanagement .abyss-create-indicator {
  margin-left: 6px !important;
  vertical-align: middle !important;
}

#accountmanagement .abyss-create-field-note,
#accountmanagement .abyss-create-text,
#accountmanagement .abyss-create-world-note {
  color: #3f2613 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}

#accountmanagement .abyss-create-field-note {
  margin-top: 4px !important;
  font-weight: 800 !important;
}

#accountmanagement .abyss-create-subtitle {
  display: block !important;
  margin-bottom: 3px !important;
  color: #62310f !important;
  font-size: 13px !important;
  font-weight: 900 !important;
}

#accountmanagement .abyss-choice-row,
#accountmanagement .abyss-create-options {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px 24px !important;
  align-items: center !important;
}

#accountmanagement .abyss-create-options {
  padding: 12px 14px !important;
  border: 1px solid rgba(168, 151, 121, .72) !important;
}

#accountmanagement .abyss-choice,
#accountmanagement .abyss-location-choice,
#accountmanagement .abyss-pvp-choice {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  color: #3a210e !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
}

#accountmanagement .abyss-location-choice,
#accountmanagement .abyss-pvp-choice {
  margin-top: 4px !important;
}

#accountmanagement .abyss-location-choice img,
#accountmanagement .abyss-pvp-choice img {
  width: auto !important;
  height: auto !important;
  max-height: 42px !important;
}

#accountmanagement .abyss-create-inline-choice {
  margin-top: 6px !important;
}

#accountmanagement .abyss-create-actions-row {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 8px 0 0 !important;
  padding: 0 !important;
}

#accountmanagement .abyss-create-actions,
#accountmanagement .abyss-create-back {
  display: inline-flex !important;
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: top !important;
}

#accountmanagement .abyss-create-character-page .BigButton,
#accountmanagement .abyss-create-character-page .BigButtonText {
  width: 132px !important;
}

#accountmanagement .abyss-success-page {
  color: #3a210e !important;
}

#accountmanagement .abyss-success-page .TableContainer,
#accountmanagement .abyss-success-page .Table1,
#accountmanagement .abyss-success-page .InnerTableContainer {
  background: #e2d8c4 !important;
  border-color: rgba(168, 151, 121, .72) !important;
  box-shadow: none !important;
}

#accountmanagement .abyss-success-message {
  min-height: 72px !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(168, 151, 121, .72) !important;
  color: #3a210e !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

#accountmanagement .abyss-success-message b {
  color: #62310f !important;
  font-weight: 900 !important;
}

#accountmanagement .abyss-success-actions-row {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  margin: 8px 0 0 !important;
  padding: 0 !important;
}

#accountmanagement .abyss-success-back {
  display: inline-flex !important;
  margin: 0 !important;
  padding: 0 !important;
}

#accountmanagement .abyss-success-page .BigButton,
#accountmanagement .abyss-success-page .BigButtonText {
  width: 132px !important;
}

#accountmanagement .abyss-change-main-page {
  color: #3a210e !important;
}

#accountmanagement .abyss-change-main-intro {
  margin: 0 0 12px !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(168, 151, 121, .72) !important;
  color: #3a210e !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}

#accountmanagement .abyss-change-main-intro b {
  color: #62310f !important;
  font-weight: 900 !important;
}

#accountmanagement .abyss-change-main-balance-ok {
  color: #2f6f1e !important;
}

#accountmanagement .abyss-change-main-balance-low,
#accountmanagement .abyss-change-main-warning {
  color: #8a1b13 !important;
}

#accountmanagement .abyss-change-main-warning a {
  color: #6f3100 !important;
  font-weight: 900 !important;
}

#accountmanagement .abyss-change-main-page .TableContainer,
#accountmanagement .abyss-change-main-page .Table1,
#accountmanagement .abyss-change-main-page .InnerTableContainer,
#accountmanagement .abyss-change-main-page .TableContentContainer {
  background: #e2d8c4 !important;
  border-color: rgba(168, 151, 121, .72) !important;
  box-shadow: none !important;
}

#accountmanagement .abyss-change-main-table td {
  padding: 8px 10px !important;
  border-color: rgba(168, 151, 121, .28) !important;
  color: #3a210e !important;
}

#accountmanagement .abyss-change-main-select {
  width: 100% !important;
  min-height: 34px !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(92, 61, 27, .72) !important;
  border-radius: 3px !important;
  background: #fff8e8 !important;
  color: #3a210e !important;
  padding: 6px 8px !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 13px !important;
  box-shadow: inset 0 1px 3px rgba(92, 51, 15, .16) !important;
}

#accountmanagement .abyss-change-main-select:focus {
  outline: 0 !important;
  border-color: rgba(126, 21, 16, .74) !important;
  box-shadow:
    0 0 0 2px rgba(126, 21, 16, .16),
    inset 0 1px 3px rgba(92, 51, 15, .16) !important;
}

#accountmanagement .abyss-change-main-actions-row {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 8px 0 0 !important;
  padding: 0 !important;
}

#accountmanagement .abyss-change-main-actions,
#accountmanagement .abyss-change-main-back {
  display: inline-flex !important;
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: top !important;
}

#accountmanagement .abyss-change-main-page .BigButton,
#accountmanagement .abyss-change-main-page .BigButtonText {
  width: 132px !important;
}

#accountmanagement .abyss-account-form-page {
  color: #3a210e !important;
}

#accountmanagement .abyss-account-form-intro {
  margin: 0 0 12px !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(168, 151, 121, .72) !important;
  color: #3a210e !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}

#accountmanagement .abyss-account-form-intro b,
#accountmanagement .abyss-account-form-intro strong {
  color: #62310f !important;
  font-weight: 900 !important;
}

#accountmanagement .abyss-account-form-page .TableContainer,
#accountmanagement .abyss-account-form-page .Table1,
#accountmanagement .abyss-account-form-page .InnerTableContainer,
#accountmanagement .abyss-account-form-page .TableContentContainer {
  background: #e2d8c4 !important;
  border-color: rgba(168, 151, 121, .72) !important;
  box-shadow: none !important;
}

#accountmanagement .abyss-account-form-table td {
  padding: 8px 10px !important;
  border-color: rgba(168, 151, 121, .28) !important;
  color: #3a210e !important;
}

#accountmanagement .abyss-account-form-input {
  width: 100% !important;
  min-height: 34px !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(92, 61, 27, .72) !important;
  border-radius: 3px !important;
  background: #fff8e8 !important;
  color: #3a210e !important;
  padding: 6px 8px !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 13px !important;
  box-shadow: inset 0 1px 3px rgba(92, 51, 15, .16) !important;
}

#accountmanagement .abyss-account-form-input:focus {
  outline: 0 !important;
  border-color: rgba(126, 21, 16, .74) !important;
  box-shadow:
    0 0 0 2px rgba(126, 21, 16, .16),
    inset 0 1px 3px rgba(92, 51, 15, .16) !important;
}

#accountmanagement .abyss-account-form-input-small {
  max-width: 220px !important;
}

#accountmanagement .abyss-account-form-select {
  max-width: 360px !important;
}

#accountmanagement .abyss-account-form-textarea {
  width: 100% !important;
  min-height: 168px !important;
  box-sizing: border-box !important;
  resize: vertical !important;
  border: 1px solid rgba(92, 61, 27, .72) !important;
  border-radius: 3px !important;
  background: #fff8e8 !important;
  color: #3a210e !important;
  padding: 8px 10px !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
  box-shadow: inset 0 1px 3px rgba(92, 51, 15, .16) !important;
}

#accountmanagement .abyss-account-form-textarea:focus {
  outline: 0 !important;
  border-color: rgba(126, 21, 16, .74) !important;
  box-shadow:
    0 0 0 2px rgba(126, 21, 16, .16),
    inset 0 1px 3px rgba(92, 51, 15, .16) !important;
}

#accountmanagement .abyss-account-form-note {
  margin-top: 4px !important;
  color: #3f2613 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
}

#accountmanagement .abyss-account-check {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  color: #3a210e !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
}

#accountmanagement .abyss-account-country-flag {
  margin-left: 8px !important;
  vertical-align: middle !important;
}

#accountmanagement .abyss-account-form-actions-row {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 8px 0 0 !important;
  padding: 0 !important;
}

#accountmanagement .abyss-account-form-actions,
#accountmanagement .abyss-account-form-back {
  display: inline-flex !important;
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: top !important;
}

#accountmanagement .abyss-account-form-page .BigButton,
#accountmanagement .abyss-account-form-page .BigButtonText {
  width: 132px !important;
}

.Content .Box .BoxContent .abyss-shop-history-page {
  color: #3a210e !important;
  font-family: Verdana, Arial, sans-serif !important;
}

.Content .Box .BoxContent .abyss-shop-history-panel {
  margin: 0 0 18px !important;
  overflow: hidden !important;
  border: 1px solid rgba(168, 151, 121, .72) !important;
  border-radius: 7px !important;
  background: #e2d8c4 !important;
  color: #3a210e !important;
  box-shadow: none !important;
}

.Content .Box .BoxContent .abyss-shop-history-page .CaptionContainer,
.Content .Box .BoxContent .abyss-shop-history-page .CaptionInnerContainer {
  min-height: 28px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  border-top: 1px solid rgba(247, 214, 137, .72) !important;
  border-bottom: 1px solid rgba(88, 18, 7, .88) !important;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 232, 166, .38),
    inset 0 -1px 0 rgba(43, 9, 3, .82) !important;
}

.Content .Box .BoxContent .abyss-shop-history-page .CaptionContainer .Text {
  width: 100% !important;
  color: #fff4c7 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
  text-align: center !important;
  text-transform: none !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content .Box .BoxContent .abyss-shop-history-body {
  padding: 12px 14px 14px !important;
  background: #e2d8c4 !important;
}

.Content .Box .BoxContent .abyss-shop-history-body h2 {
  margin: 0 0 8px !important;
  color: #3f2613 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  line-height: 1.25 !important;
  text-shadow: 0 1px 0 rgba(255, 242, 205, .45) !important;
}

.Content .Box .BoxContent .abyss-shop-history-body h2 + .abyss-shop-history-table {
  margin-bottom: 18px !important;
}

.Content .Box .BoxContent .abyss-shop-history-table {
  width: 100% !important;
  border-collapse: collapse !important;
  border: 1px solid rgba(168, 151, 121, .72) !important;
  background: #f3ead6 !important;
}

.Content .Box .BoxContent .abyss-shop-history-table th,
.Content .Box .BoxContent .abyss-shop-history-table td {
  padding: 8px 10px !important;
  border: 1px solid rgba(168, 151, 121, .28) !important;
  color: #3a210e !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  text-align: left !important;
}

.Content .Box .BoxContent .abyss-shop-history-table th {
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  color: #fff4c7 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content .Box .BoxContent .abyss-shop-history-table tr:nth-child(odd) td {
  background: #e7dcc4 !important;
}

.Content .Box .BoxContent .abyss-shop-history-table tr:nth-child(even) td {
  background: #f3ead6 !important;
}

.Content .Box .BoxContent .abyss-shop-history-empty {
  color: #3f2613 !important;
  font-weight: 800 !important;
}

.Content .Box .BoxContent .abyss-history-positive {
  color: #2f6f1e !important;
  font-weight: 900 !important;
}

.Content .Box .BoxContent .abyss-history-negative {
  color: #8a1b13 !important;
  font-weight: 900 !important;
}

/* Abyssal public pages: create account, lost account, rules, downloads and bug tracker. */
.Content :is(#createaccount, #accountlost, #lostaccount, #rules, #downloadclient, #bugtracker).Box > .Border_2 > .Border_3 > .BoxContent {
  padding: 10px 12px 18px !important;
  background: #e2d8c4 !important;
  color: #3a210e !important;
}

.Content :is(#createaccount, #accountlost, #lostaccount, #rules, #downloadclient, #bugtracker) .BoxContent,
.Content :is(#createaccount, #accountlost, #lostaccount, #rules, #downloadclient, #bugtracker) .BoxContent :is(table, tbody, tr, td, th, p, li, div, span, label, small) {
  color: #3a210e !important;
  font-family: Verdana, Arial, sans-serif !important;
}

.Content #createaccount .BoxContent .abyss-social-button--discord,
.Content #createaccount .BoxContent .abyss-social-button--discord :is(span, i, svg),
.Content #createaccount .BoxContent .abyss-social-button--discord i:before {
  color: #ffffff !important;
  fill: #ffffff !important;
}

.Content :is(#createaccount, #accountlost, #lostaccount, #rules, #downloadclient, #bugtracker) .BoxContent :is(h1, h2, h3, strong, b) {
  color: #3f2613 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(255, 242, 205, .45) !important;
}

.Content :is(#createaccount, #accountlost, #lostaccount, #rules, #downloadclient, #bugtracker) :is(.TableContainer, .Table1, .Table2, .Table3, .Table4, .Table5, .InnerTableContainer, .TableContentContainer, .TableContentAndRightShadow) {
  background: #e2d8c4 !important;
  border-color: rgba(168, 151, 121, .72) !important;
  box-shadow: none !important;
}

.Content :is(#createaccount, #accountlost, #lostaccount, #rules, #downloadclient, #bugtracker) :is(.CaptionContainer, .CaptionInnerContainer),
.abyss-public-panel__caption,
.abyss-public-subpanel__caption {
  min-height: 28px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 12px !important;
  border-top: 1px solid rgba(247, 214, 137, .72) !important;
  border-bottom: 1px solid rgba(88, 18, 7, .88) !important;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 232, 166, .38),
    inset 0 -1px 0 rgba(43, 9, 3, .82) !important;
}

.Content :is(#createaccount, #accountlost, #lostaccount, #rules, #downloadclient, #bugtracker) .CaptionContainer span {
  display: none !important;
}

.Content :is(#createaccount, #accountlost, #lostaccount, #rules, #downloadclient, #bugtracker) .CaptionContainer .Text,
.abyss-public-panel__caption,
.abyss-public-subpanel__caption {
  color: #fff4c7 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
  text-align: center !important;
  text-transform: none !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content :is(#createaccount, #accountlost, #lostaccount, #rules, #downloadclient, #bugtracker) :is(.TableContent td, td[bgcolor], .Odd, .Even) {
  border-color: rgba(168, 151, 121, .28) !important;
  background: #f3ead6 !important;
}

.Content :is(#createaccount, #accountlost, #lostaccount, #rules, #downloadclient, #bugtracker) :is(.TableContent tr:nth-child(even) td, tr:nth-child(even) > td[bgcolor]) {
  background: #e7dcc4 !important;
}

.Content :is(#createaccount, #accountlost, #lostaccount, #rules, #downloadclient, #bugtracker) :is(.LabelV, .LabelH td, th, td[class="white"]) {
  color: #3f2613 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(255, 242, 205, .45) !important;
}

.Content :is(#createaccount, #accountlost, #lostaccount, #rules, #downloadclient, #bugtracker) :is(input[type="text"], input[type="password"], input[type="email"], select, textarea, .abyss-public-input) {
  width: 100% !important;
  min-height: 34px !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(92, 61, 27, .72) !important;
  border-radius: 3px !important;
  background: #fff8e8 !important;
  color: #3a210e !important;
  padding: 6px 8px !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 13px !important;
  box-shadow: inset 0 1px 3px rgba(92, 51, 15, .16) !important;
}

.Content :is(#createaccount, #accountlost, #lostaccount, #rules, #downloadclient, #bugtracker) :is(input[type="checkbox"], input[type="radio"]) {
  width: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

.Content :is(#createaccount, #accountlost, #lostaccount, #rules, #downloadclient, #bugtracker) :is(a, .Link) {
  color: #005db8 !important;
  font-weight: 800 !important;
}

.Content :is(#createaccount, #accountlost, #lostaccount, #rules, #downloadclient, #bugtracker) :is(a:hover, .Link:hover) {
  color: #8c180e !important;
}

.abyss-public-panel {
  overflow: hidden !important;
  margin: 0 0 18px !important;
  border: 1px solid rgba(168, 151, 121, .72) !important;
  border-radius: 7px !important;
  background: #e2d8c4 !important;
  color: #3a210e !important;
  box-shadow: none !important;
}

.abyss-public-panel__body {
  padding: 12px 14px 14px !important;
  background: #e2d8c4 !important;
}

.abyss-public-note,
.abyss-public-subpanel {
  margin: 0 0 12px !important;
  border: 1px solid rgba(168, 151, 121, .72) !important;
  background: #f3ead6 !important;
}

.abyss-public-note {
  padding: 10px 12px !important;
  color: #3a210e !important;
  font-size: 13px !important;
  font-weight: 800 !important;
}

.abyss-public-list {
  margin: 8px 0 14px 18px !important;
  padding: 0 !important;
}

.abyss-public-list li {
  margin: 4px 0 !important;
}

.abyss-public-field {
  padding: 10px 12px !important;
  background: #f3ead6 !important;
}

.abyss-public-field:nth-child(even) {
  background: #e7dcc4 !important;
}

.abyss-public-field label,
.abyss-public-field strong {
  display: block !important;
  margin: 0 0 6px !important;
  color: #3f2613 !important;
  font-weight: 900 !important;
}

.abyss-public-choice {
  display: flex !important;
  align-items: flex-start !important;
  gap: 7px !important;
  margin: 6px 0 !important;
  color: #3a210e !important;
  font-weight: 700 !important;
}

.abyss-public-actions {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 8px !important;
  margin-top: 10px !important;
}

.abyss-public-actions .BigButton,
.abyss-public-actions .BigButtonText {
  width: 132px !important;
}

#downloadclient .abyss-downloads {
  color: #3a210e !important;
}

#downloadclient .abyss-downloads__hero,
#downloadclient .abyss-download-card,
#downloadclient .abyss-downloads__notice {
  border-color: rgba(168, 151, 121, .72) !important;
  background: #f3ead6 !important;
  color: #3a210e !important;
  box-shadow: none !important;
}

#downloadclient .abyss-downloads__hero h1,
#downloadclient .abyss-downloads__hero span,
#downloadclient .abyss-download-card strong,
#downloadclient .abyss-downloads__notice strong {
  color: #3f2613 !important;
  text-shadow: 0 1px 0 rgba(255, 242, 205, .45) !important;
}

#downloadclient .abyss-downloads__hero p,
#downloadclient .abyss-download-card small,
#downloadclient .abyss-downloads__notice p {
  color: #3a210e !important;
}

#downloadclient .abyss-download-card:nth-child(even) {
  background: #e7dcc4 !important;
}

#downloadclient .abyss-downloads__hero .abyss-downloads__cta {
  width: 148px !important;
  border: 1px solid #3b2300 !important;
  background: linear-gradient(180deg, #fff08a 0%, #f1b51f 38%, #b06a00 72%, #6c3300 100%) !important;
  color: #fff8cf !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-weight: 900 !important;
  text-shadow:
    1px 1px 0 #2e1600,
    -1px 1px 0 #2e1600,
    1px -1px 0 #2e1600,
    -1px -1px 0 #2e1600 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 224, .95),
    inset 0 -2px 0 rgba(67, 30, 0, .55),
    0 0 9px rgba(255, 196, 45, .48) !important;
}

#downloadclient .abyss-downloads__hero .abyss-downloads__cta:hover,
#downloadclient .abyss-downloads__hero .abyss-downloads__cta:focus-visible {
  filter: brightness(1.18) saturate(1.18) !important;
  background: linear-gradient(180deg, #fff7b4 0%, #ffd23d 36%, #d88b00 72%, #7a3900 100%) !important;
  color: #fff8cf !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 224, 1),
    inset 0 -2px 0 rgba(67, 30, 0, .48),
    0 0 16px rgba(255, 213, 59, .9) !important;
  text-shadow:
    1px 1px 0 #2e1600,
    -1px 1px 0 #2e1600,
    1px -1px 0 #2e1600,
    -1px -1px 0 #2e1600 !important;
}

/* Abyssal Server Info */
.Content #serverinfo.abyss-serverinfo {
  display: grid;
  gap: 14px;
  color: #3a210e;
}

.Content #serverinfo .abyss-serverinfo__hero,
.Content #serverinfo .abyss-serverinfo__panel,
.Content #serverinfo .abyss-serverinfo__notice,
.Content #serverinfo .abyss-serverinfo__summary article {
  border: 1px solid rgba(168, 151, 121, .72);
  background: #f3ead6;
  box-shadow: none;
}

.Content #serverinfo .abyss-serverinfo__hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 18px;
  background:
    linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98));
  color: #fff4c7;
}

.Content #serverinfo .abyss-serverinfo__hero span,
.Content #serverinfo .abyss-serverinfo__hero h1,
.Content #serverinfo .abyss-serverinfo__caption {
  color: #fff4c7;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9);
}

.Content #serverinfo .abyss-serverinfo__hero span {
  display: block;
  margin-bottom: 4px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
}

.Content #serverinfo .abyss-serverinfo__hero h1 {
  margin: 0;
  font-family: Verdana, Arial, sans-serif;
  font-size: 30px;
  line-height: 1.1;
}

.Content #serverinfo .abyss-serverinfo__hero p {
  max-width: 620px;
  margin: 8px 0 0;
  color: #e7dcc4;
  line-height: 1.45;
}

.Content #serverinfo .abyss-serverinfo__download {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 148px;
  min-height: 38px;
  border: 1px solid #3b2300;
  border-radius: 4px;
  background: linear-gradient(180deg, #fff08a 0%, #f1b51f 38%, #b06a00 72%, #6c3300 100%);
  color: #fff8cf !important;
  font-family: Verdana, Arial, sans-serif;
  font-size: 13px;
  font-weight: 900;
  text-decoration: none;
  text-shadow:
    1px 1px 0 #2e1600,
    -1px 1px 0 #2e1600,
    1px -1px 0 #2e1600,
    -1px -1px 0 #2e1600;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 224, .95),
    inset 0 -2px 0 rgba(67, 30, 0, .55),
    0 0 9px rgba(255, 196, 45, .48);
}

.Content #serverinfo .abyss-serverinfo__download:hover,
.Content #serverinfo .abyss-serverinfo__download:focus-visible {
  filter: brightness(1.18) saturate(1.18);
  background: linear-gradient(180deg, #fff7b4 0%, #ffd23d 36%, #d88b00 72%, #7a3900 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 224, 1),
    inset 0 -2px 0 rgba(67, 30, 0, .48),
    0 0 16px rgba(255, 213, 59, .9);
}

.Content #serverinfo .abyss-serverinfo__notice {
  padding: 10px 12px;
  color: #7e1510;
  font-weight: 800;
}

.Content #serverinfo .abyss-serverinfo__summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(130px, 1fr));
  gap: 10px;
}

.Content #serverinfo .abyss-serverinfo__summary article,
.Content #serverinfo .abyss-serverinfo__rate-grid article {
  padding: 13px 14px;
  background: #e7dcc4;
}

.Content #serverinfo small {
  display: block;
  margin-bottom: 7px;
  color: #3f2613;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.Content #serverinfo strong {
  color: #5a2b0c;
  font-size: 18px;
}

.Content #serverinfo .abyss-serverinfo__caption {
  min-height: 32px;
  padding: 0 14px;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98));
  font-weight: 900;
  line-height: 32px;
}

.Content #serverinfo .abyss-serverinfo__rate-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 10px;
  padding: 12px;
  background: #e2d8c4;
}

.Content #serverinfo .abyss-serverinfo__rate-grid article:nth-child(odd) {
  background: #f3ead6;
}

.Content #serverinfo .abyss-serverinfo__rate-grid em {
  display: block;
  margin-top: 6px;
  color: #7e1510;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}

.Content #serverinfo .abyss-serverinfo__stage-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 12px;
  background: #e2d8c4;
}

.Content #serverinfo .abyss-serverinfo__stage-card {
  min-width: 0;
  border: 1px solid rgba(168, 151, 121, .72);
  background: #f3ead6;
}

.Content #serverinfo .abyss-serverinfo__stage-card:first-child {
  grid-column: 1 / -1;
}

.Content #serverinfo .abyss-serverinfo__stage-card h3 {
  margin: 0;
  padding: 10px 12px;
  background: #e7dcc4;
  color: #3f2613;
  font-family: Verdana, Arial, sans-serif;
  font-size: 14px;
  font-weight: 900;
}

.Content #serverinfo .abyss-serverinfo__stage-card .abyss-serverinfo__table {
  min-width: 0;
}

.Content #serverinfo .abyss-serverinfo__table-wrap {
  overflow-x: auto;
  padding: 12px;
  background: #e2d8c4;
}

.Content #serverinfo .abyss-serverinfo__table {
  width: 100%;
  min-width: 560px;
  border-collapse: collapse;
  color: #3a210e;
}

.Content #serverinfo .abyss-serverinfo__table th,
.Content #serverinfo .abyss-serverinfo__table td {
  padding: 10px 12px;
  border: 1px solid rgba(168, 151, 121, .72);
  text-align: left;
  vertical-align: middle;
}

.Content #serverinfo .abyss-serverinfo__table th {
  background: linear-gradient(180deg, rgba(13, 55, 101, .95), rgba(4, 16, 29, .96));
  color: #fff4c7;
  font-weight: 900;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9);
}

.Content #serverinfo .abyss-serverinfo__table tbody tr:nth-child(odd) td {
  background: #f3ead6;
}

.Content #serverinfo .abyss-serverinfo__table tbody tr:nth-child(even) td {
  background: #e7dcc4;
}

@media (max-width: 900px) {
  .Content #serverinfo .abyss-serverinfo__hero,
  .Content #serverinfo .abyss-serverinfo__summary,
  .Content #serverinfo .abyss-serverinfo__rate-grid,
  .Content #serverinfo .abyss-serverinfo__stage-grid {
    grid-template-columns: 1fr;
  }

  .Content #serverinfo .abyss-serverinfo__stage-card:first-child {
    grid-column: auto;
  }

  .Content #serverinfo .abyss-serverinfo__download {
    width: 148px;
  }
}

/* Abyssal Bonus Info */
.Content #infobonus.abyss-bonusinfo {
  display: grid;
  gap: 14px;
  color: #3a210e;
}

.Content #infobonus .abyss-bonusinfo__hero,
.Content #infobonus .abyss-bonusinfo__panel,
.Content #infobonus .abyss-bonusinfo__notice,
.Content #infobonus .abyss-bonusinfo__tier-card,
.Content #infobonus .abyss-bonusinfo__loyalty-card,
.Content #infobonus .abyss-bonusinfo__empty {
  border: 1px solid rgba(168, 151, 121, .72);
  background: #f3ead6;
  box-shadow: none;
}

.Content #infobonus .abyss-bonusinfo__hero {
  padding: 14px 16px;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98));
  color: #fff4c7;
}

.Content #infobonus .abyss-bonusinfo__hero span,
.Content #infobonus .abyss-bonusinfo__hero h1,
.Content #infobonus .abyss-bonusinfo__caption {
  color: #fff4c7;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9);
}

.Content #infobonus .abyss-bonusinfo__hero span {
  display: block;
  margin-bottom: 4px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
}

.Content #infobonus .abyss-bonusinfo__hero h1 {
  margin: 0;
  font-family: Verdana, Arial, sans-serif;
  font-size: 27px;
  line-height: 1.1;
}

.Content #infobonus .abyss-bonusinfo__hero p {
  max-width: 700px;
  margin: 6px 0 0;
  color: #e7dcc4;
  line-height: 1.45;
}

.Content #infobonus .abyss-bonusinfo__notice {
  padding: 10px 12px;
  color: #7e1510;
  font-weight: 800;
}

.Content #infobonus .abyss-bonusinfo__caption {
  min-height: 32px;
  padding: 0 14px;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98));
  font-weight: 900;
  line-height: 32px;
}

.Content #infobonus .abyss-bonusinfo__filters {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  align-items: end;
  padding: 10px 12px;
  background: #e2d8c4;
}

.Content #infobonus .abyss-bonusinfo__filters label {
  display: grid;
  gap: 6px;
  color: #3f2613;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.Content #infobonus .abyss-bonusinfo__filters select {
  width: 100%;
  height: 34px;
  border: 1px solid rgba(126, 96, 51, .72);
  background: #f3ead6;
  color: #3a210e;
  font-weight: 700;
}

.Content #infobonus .abyss-bonusinfo__filters button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 104px;
  height: 34px;
  border: 1px solid #3b2300;
  border-radius: 4px;
  background: linear-gradient(180deg, #fff08a 0%, #f1b51f 38%, #b06a00 72%, #6c3300 100%);
  color: #fff8cf;
  font-size: 12px;
  font-weight: 900;
  text-shadow: 1px 1px 0 #2e1600, -1px 1px 0 #2e1600, 1px -1px 0 #2e1600, -1px -1px 0 #2e1600;
  box-shadow: inset 0 1px 0 rgba(255, 255, 224, .95), inset 0 -2px 0 rgba(67, 30, 0, .55), 0 0 9px rgba(255, 196, 45, .48);
  grid-column: 1 / -1;
  justify-self: start;
  width: 104px;
}

.Content #infobonus .abyss-bonusinfo__filters button:hover,
.Content #infobonus .abyss-bonusinfo__filters button:focus-visible {
  filter: brightness(1.18) saturate(1.18);
  background: linear-gradient(180deg, #fff7b4 0%, #ffd23d 36%, #d88b00 72%, #7a3900 100%);
  outline: 0;
}

.Content #infobonus .abyss-bonusinfo__empty {
  min-width: 0;
  background: #f3ead6;
}

.Content #infobonus .abyss-bonusinfo__empty {
  margin: 0;
  padding: 12px;
  color: #5a2b0c;
  font-weight: 800;
}

.Content #infobonus .abyss-bonusinfo__matrix-wrap {
  overflow-x: auto;
  padding: 10px 12px 12px;
  background: #e2d8c4;
}

.Content #infobonus .abyss-bonusinfo__matrix {
  min-width: 760px;
}

.Content #infobonus .abyss-bonusinfo__loyalt-matrix {
  min-width: 1120px;
}

.Content #infobonus .abyss-bonusinfo__matrix th,
.Content #infobonus .abyss-bonusinfo__matrix td {
  padding: 7px 8px;
  text-align: center;
  white-space: nowrap;
}

.Content #infobonus .abyss-bonusinfo__matrix th:first-child,
.Content #infobonus .abyss-bonusinfo__matrix td:first-child {
  position: sticky;
  left: 0;
  z-index: 2;
  min-width: 164px;
  text-align: left;
}

.Content #infobonus .abyss-bonusinfo__matrix th:first-child {
  z-index: 3;
}

.Content #infobonus .abyss-bonusinfo__matrix td:first-child {
  color: #3f2613;
  font-weight: 900;
}

.Content #infobonus .abyss-bonusinfo__matrix tbody tr:nth-child(odd) td:first-child {
  background: #f3ead6;
}

.Content #infobonus .abyss-bonusinfo__matrix tbody tr:nth-child(even) td:first-child {
  background: #e7dcc4;
}

.Content #infobonus .abyss-bonusinfo__table-wrap {
  overflow-x: auto;
  padding: 12px;
  background: #e2d8c4;
}

.Content #infobonus .abyss-bonusinfo__table {
  width: 100%;
  min-width: 820px;
  border-collapse: collapse;
  color: #3a210e;
}

.Content #infobonus .abyss-bonusinfo__table th,
.Content #infobonus .abyss-bonusinfo__table td {
  padding: 9px 10px;
  border: 1px solid rgba(168, 151, 121, .72);
  text-align: left;
  vertical-align: middle;
}

.Content #infobonus .abyss-bonusinfo__table th {
  background: linear-gradient(180deg, rgba(13, 55, 101, .95), rgba(4, 16, 29, .96));
  color: #fff4c7;
  font-weight: 900;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9);
}

.Content #infobonus .abyss-bonusinfo__table tbody tr:nth-child(odd) td {
  background: #f3ead6;
}

.Content #infobonus .abyss-bonusinfo__table tbody tr:nth-child(even) td {
  background: #e7dcc4;
}

@media (max-width: 900px) {
  .Content #infobonus .abyss-bonusinfo__filters {
    grid-template-columns: 1fr;
  }

  .Content #infobonus .abyss-bonusinfo__filters button {
    width: 104px;
  }
}

/* Abyssal Elemental Stone */
.Content #elementalstone.abyss-elemental {
  display: grid;
  gap: 14px;
  color: #3a210e;
}

.Content #elementalstone .abyss-elemental__hero,
.Content #elementalstone .abyss-elemental__panel,
.Content #elementalstone .abyss-elemental__notice,
.Content #elementalstone .abyss-elemental__summary article {
  border: 1px solid rgba(168, 151, 121, .72);
  background: #f3ead6;
  box-shadow: none;
}

.Content #elementalstone .abyss-elemental__hero {
  padding: 14px 16px;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98));
  color: #fff4c7;
}

.Content #elementalstone .abyss-elemental__hero span,
.Content #elementalstone .abyss-elemental__hero h1,
.Content #elementalstone .abyss-elemental__caption {
  color: #fff4c7;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9);
}

.Content #elementalstone .abyss-elemental__hero span {
  display: block;
  margin-bottom: 4px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
}

.Content #elementalstone .abyss-elemental__hero h1 {
  margin: 0;
  font-family: Verdana, Arial, sans-serif;
  font-size: 27px;
  line-height: 1.1;
}

.Content #elementalstone .abyss-elemental__hero p {
  max-width: 720px;
  margin: 6px 0 0;
  color: #e7dcc4;
  line-height: 1.45;
}

.Content #elementalstone .abyss-elemental__notice {
  padding: 10px 12px;
  color: #7e1510;
  font-weight: 800;
}

.Content #elementalstone .abyss-elemental__summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  gap: 10px;
}

.Content #elementalstone .abyss-elemental__summary article {
  padding: 12px 14px;
  background: #e7dcc4;
}

.Content #elementalstone small {
  display: block;
  margin-bottom: 7px;
  color: #3f2613;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.Content #elementalstone strong {
  color: #5a2b0c;
  font-size: 18px;
}

.Content #elementalstone .abyss-elemental__caption {
  min-height: 32px;
  padding: 0 14px;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98));
  font-weight: 900;
  line-height: 32px;
}

.Content #elementalstone .abyss-elemental__filters {
  display: grid;
  grid-template-columns: minmax(180px, 280px) auto;
  gap: 10px;
  align-items: end;
  padding: 10px 12px;
  background: #e2d8c4;
}

.Content #elementalstone .abyss-elemental__filters label {
  display: grid;
  gap: 6px;
  color: #3f2613;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.Content #elementalstone .abyss-elemental__filters select {
  width: 100%;
  height: 34px;
  border: 1px solid rgba(126, 96, 51, .72);
  background: #f3ead6;
  color: #3a210e;
  font-weight: 700;
}

.Content #elementalstone .abyss-elemental__filters button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 104px;
  height: 34px;
  border: 1px solid #3b2300;
  border-radius: 4px;
  background: linear-gradient(180deg, #fff08a 0%, #f1b51f 38%, #b06a00 72%, #6c3300 100%);
  color: #fff8cf;
  font-size: 12px;
  font-weight: 900;
  text-shadow: 1px 1px 0 #2e1600, -1px 1px 0 #2e1600, 1px -1px 0 #2e1600, -1px -1px 0 #2e1600;
  box-shadow: inset 0 1px 0 rgba(255, 255, 224, .95), inset 0 -2px 0 rgba(67, 30, 0, .55), 0 0 9px rgba(255, 196, 45, .48);
}

.Content #elementalstone .abyss-elemental__filters button:hover,
.Content #elementalstone .abyss-elemental__filters button:focus-visible {
  filter: brightness(1.18) saturate(1.18);
  background: linear-gradient(180deg, #fff7b4 0%, #ffd23d 36%, #d88b00 72%, #7a3900 100%);
  outline: 0;
}

.Content #elementalstone .abyss-elemental__table-wrap {
  overflow-x: auto;
  padding: 12px;
  background: #e2d8c4;
}

.Content #elementalstone .abyss-elemental__table {
  width: 100%;
  min-width: 680px;
  border-collapse: collapse;
  color: #3a210e;
}

.Content #elementalstone .abyss-elemental__upgrade-table {
  min-width: 640px;
}

.Content #elementalstone .abyss-elemental__bonus-table {
  min-width: 620px;
}

.Content #elementalstone .abyss-elemental__table th,
.Content #elementalstone .abyss-elemental__table td {
  padding: 9px 10px;
  border: 1px solid rgba(168, 151, 121, .72);
  text-align: left;
  vertical-align: middle;
}

.Content #elementalstone .abyss-elemental__table th {
  background: linear-gradient(180deg, rgba(13, 55, 101, .95), rgba(4, 16, 29, .96));
  color: #fff4c7;
  font-weight: 900;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9);
}

.Content #elementalstone .abyss-elemental__table tbody tr:nth-child(odd) td {
  background: #f3ead6;
}

.Content #elementalstone .abyss-elemental__table tbody tr:nth-child(even) td {
  background: #e7dcc4;
}

.Content #elementalstone .abyss-elemental__upgrade-table td:nth-child(2),
.Content #elementalstone .abyss-elemental__upgrade-table td:nth-child(4),
.Content #elementalstone .abyss-elemental__upgrade-table td:nth-child(5) {
  text-align: center;
}

@media (max-width: 900px) {
  .Content #elementalstone .abyss-elemental__summary,
  .Content #elementalstone .abyss-elemental__filters {
    grid-template-columns: 1fr;
  }
}

#bugtracker .abyss-public-panel__body table {
  width: 100% !important;
  border-collapse: collapse !important;
}

#bugtracker .abyss-public-panel__body table td {
  padding: 8px 10px !important;
  border: 1px solid rgba(168, 151, 121, .28) !important;
  background: #f3ead6 !important;
}

#bugtracker .abyss-public-panel__body table tr:nth-child(even) td {
  background: #e7dcc4 !important;
}

#bugtracker .abyss-public-panel__body table tr:first-child td {
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  color: #fff4c7 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-empty td {
  background: linear-gradient(180deg, rgba(6, 24, 37, .96), rgba(17, 63, 92, .9) 50%, rgba(6, 24, 37, .96)) !important;
  color: #fff4c7 !important;
}

#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-description-row td {
  background: linear-gradient(180deg, rgba(6, 24, 37, .96), rgba(17, 63, 92, .9) 50%, rgba(6, 24, 37, .96)) !important;
  color: #ffffff !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-description-row td *,
#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-description-row :is(i, b, strong) {
  color: #ffffff !important;
}

#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-answer-row--admin td {
  background: linear-gradient(180deg, #6f3b1e 0%, #4f2612 52%, #2e1409 100%) !important;
  color: #ffffff !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-answer-row--admin td * {
  color: #ffffff !important;
}

#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-answer-row--player td {
  background: linear-gradient(180deg, #d7b78f 0%, #caa376 52%, #b48655 100%) !important;
  color: #2e1608 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(255, 244, 214, .55) !important;
}

#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-answer-row--player td * {
  color: #2e1608 !important;
}

#bugtracker .abyss-public-panel__body .abyss-bugtracker-author--admin {
  color: #8c180e !important;
  font-weight: 900 !important;
}

#bugtracker .abyss-public-panel__body .abyss-bugtracker-author--player {
  color: #1f7a2e !important;
  font-weight: 900 !important;
}

#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-report-row a.abyss-bugtracker-report-link {
  color: #ffffff !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .85) !important;
}

#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-report-row td {
  background: linear-gradient(180deg, #d8c6a4 0%, #cbb78f 52%, #bda67a 100%) !important;
}

#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-admin-header td {
  background: linear-gradient(180deg, rgba(6, 24, 37, .96), rgba(17, 63, 92, .9) 50%, rgba(6, 24, 37, .96)) !important;
  color: #ffffff !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-admin-header td * {
  color: #ffffff !important;
}

#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-admin-report-row td {
  background: #e7dcc4 !important;
  color: #000000 !important;
}

#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-admin-report-row a.abyss-bugtracker-admin-report-link {
  color: #000000 !important;
  font-weight: 900 !important;
  text-decoration: none !important;
  text-shadow: none !important;
}

#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-admin-report-row td * {
  color: #000000 !important;
  text-shadow: none !important;
}

#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-detail-subject-row td:first-child,
#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-detail-subject-row td:first-child *,
#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-detail-subject-row .abyss-bugtracker-detail-status--answer {
  color: #ffffff !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-report-row .abyss-bugtracker-status--open {
  color: #1f9d3a !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(255, 244, 199, .35) !important;
}

#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-report-row .abyss-bugtracker-status--closed {
  color: #b00000 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(255, 244, 214, .45) !important;
}

#bugtracker .abyss-public-panel__body table tr.abyss-bugtracker-report-row .abyss-bugtracker-status--answer {
  color: #00a6ff !important;
  font-weight: 900 !important;
}

#bugtracker .abyss-public-panel__body a.abyss-bugtracker-action-link,
#bugtracker .abyss-public-panel__body a.abyss-bugtracker-add-link {
  color: #0055cc !important;
  font-weight: 900 !important;
  text-decoration: none !important;
}

#bugtracker .abyss-public-panel__body a.abyss-bugtracker-action-link:hover,
#bugtracker .abyss-public-panel__body a.abyss-bugtracker-add-link:hover {
  color: #008cff !important;
  text-decoration: underline !important;
}

#bugtracker .abyss-public-panel__body .abyss-bugtracker-add-form table tr.abyss-bugtracker-subject-row td {
  background: linear-gradient(180deg, rgba(6, 24, 37, .96), rgba(17, 63, 92, .9) 50%, rgba(6, 24, 37, .96)) !important;
  color: #fff4c7 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

#bugtracker .abyss-public-panel__body .abyss-bugtracker-add-form input.input2,
#bugtracker .abyss-public-panel__body .abyss-bugtracker-reply-form input.input2 {
  height: 26px !important;
  min-height: 26px !important;
  padding: 0 11px !important;
  border: 1px solid #d8a84b !important;
  border-radius: 3px !important;
  background: linear-gradient(180deg, #0b4266 0%, #06304b 48%, #021829 100%) !important;
  color: #fff4c7 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 26px !important;
  text-shadow: 0 1px 0 #000 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .28),
    inset 0 -2px 0 rgba(0, 0, 0, .46),
    0 0 0 1px rgba(0, 166, 255, .48),
    0 1px 0 rgba(0, 0, 0, .36) !important;
}

/* Abyssal community pages and public account login. */
.Content :is(#accountmanagement, #characters, #online, #lastkills, #houses, #guilds, #guildwar, #wars, #polls, #team, #bans, #forum).Box > .Border_2 > .Border_3 > .BoxContent {
  padding: 10px 12px 18px !important;
  background: #e2d8c4 !important;
  color: #3a210e !important;
}

.Content :is(#accountmanagement, #characters, #online, #lastkills, #houses, #guilds, #guildwar, #wars, #polls, #team, #bans, #forum) .BoxContent,
.Content :is(#accountmanagement, #characters, #online, #lastkills, #houses, #guilds, #guildwar, #wars, #polls, #team, #bans, #forum) .BoxContent :is(table, tbody, tr, td, th, p, li, div, span, label, small) {
  color: #3a210e !important;
  font-family: Verdana, Arial, sans-serif !important;
}

.Content :is(#accountmanagement, #characters, #online, #lastkills, #houses, #guilds, #guildwar, #wars, #polls, #team, #bans, #forum) .BoxContent :is(h1, h2, h3, strong, b) {
  color: #3f2613 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(255, 242, 205, .45) !important;
}

.Content :is(#accountmanagement, #characters, #online, #lastkills, #houses, #guilds, #guildwar, #wars, #polls, #team, #bans, #forum) :is(.TableContainer, .Table1, .Table2, .Table3, .Table4, .Table5, .InnerTableContainer, .TableContentContainer, .TableContentAndRightShadow, fieldset) {
  background: #e2d8c4 !important;
  border-color: rgba(168, 151, 121, .72) !important;
  box-shadow: none !important;
}

.Content :is(#accountmanagement, #characters, #online, #lastkills, #houses, #guilds, #guildwar, #wars, #polls, #team, #bans, #forum) :is(.CaptionContainer, .CaptionInnerContainer),
.Content :is(#accountmanagement, #characters, #online, #lastkills, #houses, #guilds, #guildwar, #wars, #polls, #team, #bans, #forum) :is(.LabelH, .LabelH td, th, td.white) {
  min-height: 28px !important;
  border-top: 1px solid rgba(247, 214, 137, .72) !important;
  border-bottom: 1px solid rgba(88, 18, 7, .88) !important;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  color: #fff4c7 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 232, 166, .38),
    inset 0 -1px 0 rgba(43, 9, 3, .82) !important;
}

.Content :is(#accountmanagement, #characters, #online, #lastkills, #houses, #guilds, #guildwar, #wars, #polls, #team, #bans, #forum) .CaptionContainer span {
  display: none !important;
}

.Content :is(#accountmanagement, #characters, #online, #lastkills, #houses, #guilds, #guildwar, #wars, #polls, #team, #bans, #forum) .CaptionContainer .Text {
  display: block !important;
  color: #fff4c7 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 28px !important;
  text-align: center !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content :is(#accountmanagement, #characters, #online, #lastkills, #houses, #guilds, #guildwar, #wars, #polls, #team, #bans, #forum) :is(.TableContent td, td[bgcolor], .Odd, .Even, tr[bgcolor] > td) {
  border-color: rgba(168, 151, 121, .28) !important;
  background: #f3ead6 !important;
}

.Content :is(#accountmanagement, #characters, #online, #lastkills, #houses, #guilds, #guildwar, #wars, #polls, #team, #bans, #forum) :is(.TableContent tr:nth-child(even) td, tr:nth-child(even) > td[bgcolor], .Even) {
  background: #e7dcc4 !important;
}

.Content :is(#accountmanagement, #characters, #online, #lastkills, #houses, #guilds, #guildwar, #wars, #polls, #team, #bans, #forum) :is(.LabelV, label, legend) {
  color: #3f2613 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(255, 242, 205, .45) !important;
}

.Content :is(#accountmanagement, #characters, #online, #lastkills, #houses, #guilds, #guildwar, #wars, #polls, #team, #bans, #forum) :is(input[type="text"], input[type="password"], input[type="email"], select, textarea) {
  box-sizing: border-box !important;
  border: 1px solid rgba(92, 61, 27, .72) !important;
  border-radius: 3px !important;
  background: #fff8e8 !important;
  color: #3a210e !important;
  padding: 6px 8px !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 13px !important;
  box-shadow: inset 0 1px 3px rgba(92, 51, 15, .16) !important;
}

.Content :is(#accountmanagement, #characters, #online, #lastkills, #houses, #guilds, #guildwar, #wars, #polls, #team, #bans, #forum) :is(input[type="checkbox"], input[type="radio"]) {
  width: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  background: initial !important;
  box-shadow: none !important;
}

.Content :is(#accountmanagement, #characters, #online, #lastkills, #houses, #guilds, #guildwar, #wars, #polls, #team, #bans, #forum) :is(a, .Link) {
  color: #005db8 !important;
  font-weight: 800 !important;
}

.Content :is(#accountmanagement, #characters, #online, #lastkills, #houses, #guilds, #guildwar, #wars, #polls, #team, #bans, #forum) :is(a:hover, .Link:hover) {
  color: #8c180e !important;
}

#lastkills .abyss-lastkills-rank {
  width: 48px !important;
  min-width: 48px !important;
  white-space: nowrap !important;
  text-align: center !important;
}

#lastkills .abyss-lastkills-time {
  width: 150px !important;
  min-width: 150px !important;
  white-space: nowrap !important;
}

#lastkills .abyss-lastkills-time small {
  white-space: nowrap !important;
}

#lastkills .TableContainer .abyss-lastkills-caption,
#lastkills .TableContainer .abyss-lastkills-caption .CaptionInnerContainer {
  min-height: 30px !important;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  border-top: 1px solid rgba(247, 214, 137, .72) !important;
  border-bottom: 1px solid rgba(88, 18, 7, .88) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 232, 166, .38),
    inset 0 -1px 0 rgba(43, 9, 3, .82) !important;
}

#lastkills .TableContainer .abyss-lastkills-caption .Text {
  color: #fff4c7 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

#houses .abyss-house-search-row > td {
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  border-top: 1px solid rgba(247, 214, 137, .72) !important;
  border-bottom: 1px solid rgba(88, 18, 7, .88) !important;
  color: #fff4c7 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

#houses .abyss-houses-submit-table {
  width: auto !important;
  margin: 0 auto !important;
}

#houses .abyss-houses-submit-table .BigButton {
  width: 72px !important;
  height: 24px !important;
  min-width: 72px !important;
  display: inline-block !important;
  overflow: hidden !important;
  border-color: rgba(216, 168, 75, .74) !important;
  background: linear-gradient(180deg, #0d3765, #04101d) !important;
  box-shadow: inset 0 0 18px rgba(0, 166, 255, .28), 0 0 18px rgba(0, 166, 255, .14) !important;
}

#houses .abyss-houses-submit-table .BigButton:hover,
#houses .abyss-houses-submit-table .BigButton:focus-within {
  background: linear-gradient(180deg, #0f4e91, #051726) !important;
  box-shadow: inset 0 0 22px rgba(0, 166, 255, .48), 0 0 22px rgba(0, 166, 255, .26) !important;
}

#houses .abyss-houses-submit-table .BigButton > div {
  width: 100% !important;
  height: 100% !important;
}

#houses .abyss-houses-submit-table .BigButtonOver {
  display: none !important;
}

#houses .abyss-houses-submit-table .BigButtonText {
  position: static !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 12px !important;
  line-height: 24px !important;
}

#houses .abyss-houses-results-table {
  width: 100% !important;
  table-layout: fixed !important;
  border-collapse: collapse !important;
  background: #e2d8c4 !important;
  border: 1px solid rgba(168, 151, 121, .72) !important;
}

#houses .abyss-houses-results-title > td,
#houses .abyss-houses-results-head > td {
  padding: 7px 10px !important;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  border-top: 1px solid rgba(247, 214, 137, .72) !important;
  border-bottom: 1px solid rgba(88, 18, 7, .88) !important;
  color: #fff4c7 !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

#houses .abyss-houses-results-title > td *,
#houses .abyss-houses-results-head > td * {
  color: #fff4c7 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

#houses .abyss-houses-results-table tr:not(.abyss-houses-results-title):not(.abyss-houses-results-head) > td {
  padding: 7px 10px !important;
  border-bottom: 1px solid rgba(168, 151, 121, .28) !important;
  background: #f3ead6 !important;
  line-height: 1.25 !important;
  vertical-align: middle !important;
}

#houses .abyss-houses-results-table tr:nth-child(even):not(.abyss-houses-results-title):not(.abyss-houses-results-head) > td {
  background: #e7dcc4 !important;
}

#houses .abyss-houses-results-table .abyss-house-name {
  width: 38% !important;
}

#houses .abyss-houses-results-table .abyss-house-size {
  width: 10% !important;
  text-align: center !important;
  white-space: nowrap !important;
}

#houses .abyss-houses-results-table .abyss-house-rent {
  width: 16% !important;
  white-space: nowrap !important;
}

#houses .abyss-houses-results-table .abyss-house-status {
  width: 26% !important;
}

#houses .abyss-houses-results-table .abyss-house-action {
  width: 72px !important;
  padding: 4px 6px !important;
  text-align: center !important;
  white-space: nowrap !important;
}

#houses .abyss-house-view-form {
  display: flex !important;
  justify-content: center !important;
  margin: 0 !important;
}

#houses .abyss-house-view-form .BigButton {
  width: 56px !important;
  height: 24px !important;
  min-width: 56px !important;
  display: inline-block !important;
  overflow: hidden !important;
  border-color: rgba(216, 168, 75, .74) !important;
  background: linear-gradient(180deg, #0d3765, #04101d) !important;
  box-shadow: inset 0 0 18px rgba(0, 166, 255, .28), 0 0 14px rgba(0, 166, 255, .12) !important;
}

#houses .abyss-house-view-form .BigButton:hover,
#houses .abyss-house-view-form .BigButton:focus-within {
  background: linear-gradient(180deg, #0f4e91, #051726) !important;
  box-shadow: inset 0 0 22px rgba(0, 166, 255, .48), 0 0 18px rgba(0, 166, 255, .2) !important;
}

#houses .abyss-house-view-form .BigButton > div {
  width: 100% !important;
  height: 100% !important;
}

#houses .abyss-house-view-form .BigButtonOver {
  display: none !important;
}

#houses .abyss-house-view-form .BigButtonText {
  position: static !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 11px !important;
  line-height: 24px !important;
}

#polls .abyss-polls-intro {
  padding: 2px 0 10px !important;
  color: #3a210e !important;
  line-height: 1.45 !important;
}

#polls .abyss-polls-intro b {
  color: #3f2613 !important;
  font-weight: 900 !important;
}

#polls .abyss-polls-section {
  margin: 0 0 14px !important;
  background: #e2d8c4 !important;
  border: 1px solid rgba(168, 151, 121, .72) !important;
  box-shadow: none !important;
}

#polls .abyss-polls-caption,
#polls .abyss-polls-caption .CaptionInnerContainer {
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
}

#polls .abyss-polls-caption .Text {
  color: #fff4c7 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

#polls .abyss-polls-table {
  width: 100% !important;
  border-collapse: collapse !important;
  border: 1px solid rgba(168, 151, 121, .72) !important;
  background: #e2d8c4 !important;
}

#polls .abyss-polls-table td {
  padding: 8px 10px !important;
  border-bottom: 1px solid rgba(168, 151, 121, .28) !important;
  color: #3a210e !important;
  line-height: 1.25 !important;
}

#polls .abyss-polls-head > td,
#polls .abyss-polls-head > td * {
  background: #e7dcc4 !important;
  color: #3f2613 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(255, 242, 205, .45) !important;
}

#polls .abyss-polls-table tr:nth-child(odd):not(.abyss-polls-head) > td {
  background: #f3ead6 !important;
}

#polls .abyss-polls-table tr:nth-child(even):not(.abyss-polls-head) > td {
  background: #e7dcc4 !important;
}

#polls .abyss-polls-empty {
  text-align: center !important;
  color: #3f2613 !important;
}

#polls .abyss-polls-detail {
  margin: 0 0 14px !important;
  background: #e2d8c4 !important;
  border: 1px solid rgba(168, 151, 121, .72) !important;
  color: #3a210e !important;
}

#polls .abyss-polls-detail__caption {
  padding: 8px 12px !important;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  border-bottom: 1px solid rgba(88, 18, 7, .88) !important;
  color: #ffe19b !important;
  font-weight: 900 !important;
  font-size: 14px !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

#polls .abyss-polls-detail__caption,
#polls .abyss-polls-detail__caption * {
  color: #ffe19b !important;
}

#polls .abyss-polls-question {
  padding: 12px !important;
  background: #f3ead6 !important;
  border-bottom: 1px solid rgba(168, 151, 121, .34) !important;
  color: #3a210e !important;
}

#polls .abyss-polls-question b {
  display: block !important;
  margin-bottom: 4px !important;
  color: #3f2613 !important;
  font-weight: 900 !important;
}

#polls .abyss-polls-question p {
  margin: 0 !important;
  color: #3a210e !important;
  line-height: 1.45 !important;
}

#polls .abyss-polls-options {
  padding: 10px 12px 12px !important;
  background: #e7dcc4 !important;
}

#polls .abyss-polls-option {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 28px !important;
  margin: 0 0 6px !important;
  padding: 7px 9px !important;
  background: #f3ead6 !important;
  border: 1px solid rgba(168, 151, 121, .38) !important;
  color: #3a210e !important;
  cursor: pointer !important;
}

#polls .abyss-polls-option:nth-child(even) {
  background: #e7dcc4 !important;
}

#polls .abyss-polls-option input {
  margin: 0 !important;
}

#polls .abyss-polls-option span {
  color: #3a210e !important;
}

#polls .abyss-polls-submit.input2 {
  width: 96px !important;
  height: 30px !important;
  margin: 0 0 12px 12px !important;
  border: 1px solid rgba(216, 168, 75, .84) !important;
  border-radius: 4px !important;
  background: linear-gradient(180deg, #0d3765, #04101d) !important;
  box-shadow: inset 0 0 18px rgba(0, 166, 255, .28), 0 0 18px rgba(0, 166, 255, .14) !important;
  color: #ffe19b !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 0 #000 !important;
}

#polls .abyss-polls-submit.input2:hover,
#polls .abyss-polls-submit.input2:focus {
  background: linear-gradient(180deg, #0f4e91, #051726) !important;
  box-shadow: inset 0 0 22px rgba(0, 166, 255, .48), 0 0 22px rgba(0, 166, 255, .26) !important;
}

#polls .abyss-polls-results {
  padding: 10px 12px 12px !important;
  background: #e2d8c4 !important;
}

#polls .abyss-polls-result-row {
  display: grid !important;
  grid-template-columns: minmax(160px, 1fr) minmax(140px, 220px) minmax(105px, auto) !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 9px 10px !important;
  border-bottom: 1px solid rgba(168, 151, 121, .3) !important;
  background: #f3ead6 !important;
  color: #3a210e !important;
}

#polls .abyss-polls-result-row:nth-child(even) {
  background: #e7dcc4 !important;
}

#polls .abyss-polls-result-label,
#polls .abyss-polls-result-votes {
  color: #3a210e !important;
}

#polls .abyss-polls-result-label {
  font-weight: 700 !important;
}

#polls .abyss-polls-result-votes {
  text-align: right !important;
  white-space: nowrap !important;
}

#polls .abyss-polls-result-votes b {
  color: #3f2613 !important;
  font-weight: 900 !important;
}

#polls .abyss-polls-progress {
  height: 14px !important;
  overflow: hidden !important;
  border: 1px solid rgba(93, 65, 31, .45) !important;
  background: #d6c8ad !important;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .18) !important;
}

#polls .abyss-polls-progress span {
  display: block !important;
  height: 100% !important;
  min-width: 0 !important;
  background: linear-gradient(180deg, #d8a84b, #9d6a22) !important;
}

#polls .abyss-polls-notice,
#polls .abyss-polls-meta,
#polls .abyss-polls-back {
  margin: 10px 0 !important;
  padding: 10px 12px !important;
  background: #f3ead6 !important;
  border: 1px solid rgba(168, 151, 121, .42) !important;
  color: #3a210e !important;
}

#polls .abyss-polls-notice b,
#polls .abyss-polls-meta span,
#polls .abyss-polls-meta b {
  color: #3f2613 !important;
  font-weight: 900 !important;
}

#polls .abyss-polls-meta {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

#polls .abyss-polls-back a {
  color: #3f2613 !important;
  font-weight: 900 !important;
  text-decoration: none !important;
}

#polls .abyss-polls-back a:hover {
  color: #7e1510 !important;
}

@media (max-width: 720px) {
  #polls .abyss-polls-result-row,
  #polls .abyss-polls-meta {
    grid-template-columns: 1fr !important;
  }

  #polls .abyss-polls-result-votes {
    text-align: left !important;
  }
}

#polls .abyss-polls-admin-link {
  display: inline-block !important;
  text-decoration: none !important;
}

#polls .abyss-polls-admin-link .BigButton {
  width: 72px !important;
  height: 24px !important;
  min-width: 72px !important;
  display: inline-block !important;
  overflow: hidden !important;
  border-color: rgba(216, 168, 75, .74) !important;
  background: linear-gradient(180deg, #0d3765, #04101d) !important;
  box-shadow: inset 0 0 18px rgba(0, 166, 255, .28), 0 0 18px rgba(0, 166, 255, .14) !important;
}

#polls .abyss-polls-admin-link .BigButton:hover,
#polls .abyss-polls-admin-link .BigButton:focus-within {
  background: linear-gradient(180deg, #0f4e91, #051726) !important;
  box-shadow: inset 0 0 22px rgba(0, 166, 255, .48), 0 0 22px rgba(0, 166, 255, .26) !important;
}

#polls .abyss-polls-admin-link .BigButton > div {
  width: 100% !important;
  height: 100% !important;
}

#polls .abyss-polls-admin-link .BigButtonOver {
  display: none !important;
}

#polls .abyss-polls-admin-link .BigButtonText {
  position: static !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 12px !important;
  line-height: 24px !important;
}

#guilds .abyss-guilds-intro {
  padding: 2px 0 16px !important;
  color: #3a210e !important;
  line-height: 1.45 !important;
}

#guilds .abyss-guilds-section {
  margin: 0 0 14px !important;
  background: #e2d8c4 !important;
  border: 1px solid rgba(168, 151, 121, .72) !important;
  box-shadow: none !important;
}

#guilds .abyss-guilds-caption,
#guilds .abyss-guilds-caption .CaptionInnerContainer {
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
}

#guilds .abyss-guilds-caption .Text {
  color: #fff4c7 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

#guilds .abyss-guilds-table {
  width: 100% !important;
  border-collapse: collapse !important;
  border: 1px solid rgba(168, 151, 121, .72) !important;
  background: #e2d8c4 !important;
}

#guilds .abyss-guilds-table td {
  padding: 8px 10px !important;
  border-bottom: 1px solid rgba(168, 151, 121, .28) !important;
  color: #3a210e !important;
  line-height: 1.25 !important;
  vertical-align: middle !important;
}

#guilds .abyss-guilds-head > td,
#guilds .abyss-guilds-head > td * {
  background: #e7dcc4 !important;
  color: #3f2613 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(255, 242, 205, .45) !important;
}

#guilds .abyss-guilds-table tr:nth-child(odd):not(.abyss-guilds-head) > td {
  background: #f3ead6 !important;
}

#guilds .abyss-guilds-table tr:nth-child(even):not(.abyss-guilds-head) > td {
  background: #e7dcc4 !important;
}

#guilds .abyss-guilds-logo {
  width: 84px !important;
  text-align: center !important;
}

#guilds .abyss-guilds-description b {
  color: #3f2613 !important;
  font-weight: 900 !important;
}

#guilds .abyss-guilds-action {
  width: 92px !important;
  text-align: center !important;
  white-space: nowrap !important;
}

#guilds .abyss-guilds-empty-row > td {
  background: #f3ead6 !important;
}

#guilds .abyss-guilds-footer {
  background: #e2d8c4 !important;
}

#guilds .abyss-guilds-footer td {
  color: #3a210e !important;
  line-height: 1.35 !important;
}

#guilds .abyss-guilds-footer-content {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
}

#guilds .abyss-guilds-button-form {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: auto !important;
  margin: 4px auto !important;
}

#guilds .abyss-guilds-button-form .BigButton {
  width: 64px !important;
  height: 24px !important;
  min-width: 64px !important;
  max-width: 64px !important;
  display: inline-block !important;
  overflow: hidden !important;
  border-color: rgba(216, 168, 75, .74) !important;
  background: linear-gradient(180deg, #0d3765, #04101d) !important;
  background-image: linear-gradient(180deg, #0d3765, #04101d) !important;
  box-shadow: inset 0 0 18px rgba(0, 166, 255, .28), 0 0 18px rgba(0, 166, 255, .14) !important;
}

#guilds .abyss-guilds-button-form .BigButton:hover,
#guilds .abyss-guilds-button-form .BigButton:focus-within {
  background: linear-gradient(180deg, #0f4e91, #051726) !important;
  box-shadow: inset 0 0 22px rgba(0, 166, 255, .48), 0 0 22px rgba(0, 166, 255, .26) !important;
}

#guilds .abyss-guilds-button-form .BigButton > div {
  width: 100% !important;
  height: 100% !important;
}

#guilds .abyss-guilds-button-form .BigButtonOver {
  display: none !important;
}

#guilds .abyss-guilds-button-form .BigButtonText {
  position: static !important;
  display: block !important;
  width: 100% !important;
  max-width: 64px !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #fff4c7 !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 24px !important;
  text-align: center !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
  text-transform: uppercase !important;
}

#guilds .abyss-guilds-create-section {
  overflow: hidden !important;
}

#guilds .abyss-guilds-create-form-panel {
  margin: 0 !important;
}

#guilds .abyss-guilds-create-body {
  padding: 0 !important;
  background: #e2d8c4 !important;
}

#guilds .abyss-guilds-field-row {
  display: grid !important;
  grid-template-columns: 136px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: start !important;
  padding: 9px 10px !important;
  border-bottom: 1px solid rgba(168, 151, 121, .28) !important;
  background: #f3ead6 !important;
}

#guilds .abyss-guilds-field-row:nth-child(even) {
  background: #e7dcc4 !important;
}

#guilds .abyss-guilds-field-row label {
  color: #3f2613 !important;
  font-weight: 900 !important;
  line-height: 28px !important;
  text-shadow: 0 1px 0 rgba(255, 242, 205, .45) !important;
}

#guilds .abyss-guilds-field-control select,
#guilds .abyss-guilds-field-control input {
  width: 100% !important;
  min-height: 28px !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(92, 61, 27, .72) !important;
  border-radius: 3px !important;
  background: #fff8e8 !important;
  color: #3a210e !important;
  padding: 5px 8px !important;
}

#guilds .abyss-guilds-field-control input {
  max-width: 260px !important;
}

#guilds .abyss-guilds-field-control span {
  display: block !important;
  margin-top: 4px !important;
  color: #5b4227 !important;
  font-size: 10px !important;
}

#guilds .abyss-guilds-create-actions {
  display: flex !important;
  justify-content: center !important;
  gap: 10px !important;
  padding: 18px 10px 12px !important;
  background: #e2d8c4 !important;
}

#guilds .abyss-guilds-create-actions .abyss-guilds-button-form {
  margin: 0 !important;
}

#guilds .abyss-guilds-create-actions .BigButton,
#guilds .abyss-guilds-back-button {
  width: 72px !important;
  height: 24px !important;
  min-width: 72px !important;
  max-width: 72px !important;
  display: inline-block !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  border: 1px solid rgba(216, 168, 75, .74) !important;
  border-radius: 4px !important;
  background: linear-gradient(180deg, #0d3765, #04101d) !important;
  background-image: linear-gradient(180deg, #0d3765, #04101d) !important;
  box-shadow: inset 0 0 18px rgba(0, 166, 255, .28), 0 0 18px rgba(0, 166, 255, .14) !important;
  color: #fff4c7 !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 22px !important;
  text-align: center !important;
  text-decoration: none !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
  text-transform: uppercase !important;
}

#guilds .abyss-guilds-back-button,
#guilds .abyss-guilds-back-button:visited,
#guilds .abyss-guilds-back-button:active,
#guilds .abyss-guilds-back-button:focus {
  color: #fff4c7 !important;
}

#guilds .abyss-guilds-create-actions .BigButton:hover,
#guilds .abyss-guilds-back-button:hover {
  background: linear-gradient(180deg, #0f4e91, #051726) !important;
  color: #fff4c7 !important;
}

#guilds .abyss-guilds-create-actions .BigButton > div {
  width: 100% !important;
  height: 100% !important;
}

#guilds .abyss-guilds-create-actions .BigButtonOver {
  display: none !important;
}

#guilds .abyss-guilds-create-actions .BigButtonText {
  position: static !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  color: #fff4c7 !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 24px !important;
  text-align: center !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
  text-transform: uppercase !important;
}

#accountmanagement .abyss-login-page {
  padding: 34px 0 40px !important;
  background: rgba(7, 28, 45, .12) !important;
}

#accountmanagement .abyss-login-card {
  max-width: 560px !important;
  margin: 0 auto !important;
  overflow: hidden !important;
  border: 1px solid rgba(168, 151, 121, .82) !important;
  border-radius: 7px !important;
  background: #e2d8c4 !important;
  box-shadow: 0 12px 28px rgba(34, 18, 8, .22) !important;
}

#accountmanagement .abyss-login-card__intro {
  padding: 20px 26px !important;
  border-bottom: 1px solid rgba(88, 18, 7, .88) !important;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  text-align: center !important;
}

#accountmanagement .abyss-login-card__intro span,
#accountmanagement .abyss-login-card__intro p {
  color: #f3ead6 !important;
}

#accountmanagement .abyss-login-card h1 {
  color: #fff4c7 !important;
  font-size: 32px !important;
  line-height: 1.1 !important;
  text-shadow: 0 2px 0 rgba(0, 0, 0, .75) !important;
}

#accountmanagement .abyss-login-form,
#accountmanagement .abyss-login-actions {
  padding: 18px 28px !important;
  background: #e2d8c4 !important;
}

#accountmanagement .abyss-login-actions {
  padding-top: 0 !important;
}

#accountmanagement .abyss-login-label {
  margin: 0 0 6px !important;
}

#accountmanagement .abyss-login-input {
  width: 100% !important;
  min-height: 44px !important;
  margin: 0 0 12px !important;
}

#accountmanagement .abyss-login-remember {
  margin: 2px 0 16px !important;
  color: #3f2613 !important;
  font-weight: 800 !important;
}

#accountmanagement .abyss-login-form .fantasy-button,
#accountmanagement .abyss-login-actions .fantasy-button {
  width: 100% !important;
  min-height: 42px !important;
  border: 1px solid #d8b15a !important;
  border-radius: 5px !important;
  background: linear-gradient(180deg, #0b4266 0%, #06304b 48%, #021829 100%) !important;
  color: #fff4c7 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 #000 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .28),
    inset 0 -2px 0 rgba(0, 0, 0, .46),
    0 0 0 1px rgba(0, 166, 255, .48),
    0 1px 0 rgba(0, 0, 0, .36) !important;
}

#accountmanagement .abyss-login-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

#accountmanagement .abyss-login-actions form {
  margin: 0 !important;
}

.Content #accountmanagement .BoxContent .abyss-login-card__intro span,
.Content #accountmanagement .BoxContent .abyss-login-card__intro p {
  color: #f3ead6 !important;
  display: block !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

.Content #accountmanagement .BoxContent .abyss-login-card h1 {
  color: #fff4c7 !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  text-shadow: 0 2px 0 rgba(0, 0, 0, .75) !important;
}

.Content #accountmanagement .BoxContent .abyss-login-card__intro p {
  max-width: 430px !important;
}

/* Final polish for create account, lost account, downloads and bug tracker. */
#createaccount table[width="100%"]:has(.BigButton) {
  width: auto !important;
  margin: 0 auto !important;
}

#createaccount table[width="100%"]:has(.BigButton) td {
  width: auto !important;
  padding: 0 !important;
  background: transparent !important;
}

#createaccount .BigButton,
#createaccount .BigButtonText,
#lostaccount .abyss-public-actions .BigButton,
#lostaccount .abyss-public-actions .BigButtonText {
  width: 132px !important;
  min-width: 132px !important;
  max-width: 132px !important;
  height: 42px !important;
}

#createaccount .BigButtonText,
#lostaccount .abyss-public-actions .BigButtonText {
  display: block !important;
  height: 42px !important;
  line-height: 42px !important;
  text-align: center !important;
}

#lostaccount .abyss-public-panel__caption,
#lostaccount .abyss-public-subpanel__caption,
#bugtracker .abyss-public-panel__caption {
  justify-content: center !important;
  min-height: 30px !important;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  color: #fff4c7 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 30px !important;
  text-align: center !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 232, 166, .38),
    inset 0 -1px 0 rgba(43, 9, 3, .82) !important;
}

.Content #bugtracker .BoxContent .abyss-public-panel__caption {
  color: #fff4c7 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content #createaccount .BoxContent .abyss-public-panel__caption {
  color: #fff4c7 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content .Box .BoxContent .abyss-lost-page :is(.abyss-public-panel__caption, .abyss-public-subpanel__caption) {
  color: #fff4c7 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 30px !important;
  text-align: center !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

#downloadclient .abyss-downloads__grid {
  grid-template-columns: minmax(260px, 420px) !important;
  justify-content: center !important;
}

#downloadclient .abyss-download-card {
  min-height: 210px !important;
}

.Content #createaccount .TableContainer > .Table5 > .CaptionContainer,
.Content #accountcreate #createaccount .TableContainer > .Table5 > .CaptionContainer {
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  border-top: 1px solid rgba(247, 214, 137, .72) !important;
  border-bottom: 1px solid rgba(88, 18, 7, .88) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 232, 166, .38),
    inset 0 -1px 0 rgba(43, 9, 3, .82) !important;
}

.Content #createaccount .TableContainer > .Table5 > .CaptionContainer > .CaptionInnerContainer,
.Content #accountcreate #createaccount .TableContainer > .Table5 > .CaptionContainer > .CaptionInnerContainer {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.Content #rules .abyss-rules-language {
  width: min(760px, 100%) !important;
  margin: 0 auto 10px !important;
  padding: 12px 0 0 !important;
  display: grid !important;
  grid-template-columns: 72px minmax(260px, 460px) 72px !important;
  align-items: center !important;
  justify-content: center !important;
  column-gap: 18px !important;
}

.Content #rules .abyss-rules-language img {
  display: block !important;
  width: 52px !important;
  height: auto !important;
  margin: 0 auto !important;
}

.Content #rules .abyss-rules-language form {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

.Content #rules .abyss-rules-language select {
  width: 100% !important;
  min-height: 34px !important;
}

@media (max-width: 640px) {
  .Content #rules .abyss-rules-language {
    grid-template-columns: 40px minmax(160px, 1fr) 40px !important;
    column-gap: 8px !important;
  }

.Content #rules .abyss-rules-language img {
    width: 36px !important;
  }
}

.Content #online .abyss-online-summary__cell {
  vertical-align: top !important;
}

.Content #online .abyss-online-summary__cell > .TableContainer {
  width: 100% !important;
}

.Content #online .abyss-online-summary__cell--frags .InnerTableContainer {
  min-height: 102px !important;
  display: flex !important;
  align-items: center !important;
}

.Content #online .abyss-online-summary__cell--frags .InnerTableContainer > table {
  width: 100% !important;
}

.Content #rules .abyss-rules-page {
  padding: 16px 22px 28px !important;
  color: #3b2817 !important;
  font-family: Verdana, Arial, sans-serif !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
}

.Content #rules .abyss-rules-intro,
.Content #rules .abyss-rules-category,
.Content #rules .abyss-rules-footer {
  width: min(856px, 100%) !important;
  margin: 0 auto 16px !important;
}

.Content #rules .abyss-rules-intro__bar,
.Content #rules .abyss-rules-category__header {
  min-height: 34px !important;
  padding: 6px 18px !important;
  border: 1px solid rgba(199, 145, 37, .9) !important;
  border-radius: 4px 4px 0 0 !important;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  color: #fff4c7 !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 17px !important;
  font-weight: 900 !important;
  line-height: 22px !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 0 #000 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 232, 166, .38),
    inset 0 -1px 0 rgba(0, 0, 0, .72) !important;
}

.Content #rules .abyss-rules-intro__bar span,
.Content #rules .abyss-rules-category__header {
  color: #fff4c7 !important;
}

.Content #rules .abyss-rules-intro__body,
.Content #rules .abyss-rules-category__body,
.Content #rules .abyss-rules-footer {
  border-right: 2px solid #c99725 !important;
  border-bottom: 2px solid #c99725 !important;
  border-left: 2px solid #c99725 !important;
  background: rgba(239, 222, 181, .94) !important;
  box-shadow: 0 2px 0 rgba(79, 48, 10, .28) !important;
}

.Content #rules .abyss-rules-intro__body {
  padding: 16px 24px !important;
}

.Content #rules .abyss-rules-category__body {
  padding: 18px 24px 20px !important;
}

.Content #rules .abyss-rules-category__description {
  margin: 0 0 14px !important;
}

.Content #rules .abyss-rules-rule {
  margin: 0 !important;
  padding: 0 !important;
  border-bottom: 1px solid rgba(106, 82, 50, .38) !important;
}

.Content #rules .abyss-rules-rule:last-child {
  border-bottom: 0 !important;
}

.Content #rules .abyss-rules-rule > summary {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 18px minmax(0, 1fr) !important;
  gap: 10px !important;
  padding: 12px 10px 10px 16px !important;
  list-style: none !important;
  cursor: pointer !important;
  color: #3b2817 !important;
  align-items: start !important;
}

.Content #rules .abyss-rules-rule > summary::-webkit-details-marker {
  display: none !important;
}

.Content #rules .abyss-rules-rule > summary::before {
  content: "›" !important;
  display: inline-block !important;
  color: #5b4228 !important;
  font-size: 22px !important;
  font-weight: 900 !important;
  line-height: 20px !important;
  transform: rotate(0deg) !important;
  transition: transform .15s ease !important;
  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;
}

.Content #rules .abyss-rules-rule[open] > summary::before {
  transform: rotate(90deg) !important;
}

.Content #rules .abyss-rules-rule[open] > summary {
  background: rgba(184, 160, 118, .38) !important;
}

.Content #rules .abyss-rules-rule__title {
  display: block !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  line-height: 1.25 !important;
  min-width: 0 !important;
}

.Content #rules .abyss-rules-rule__summary {
  display: block !important;
  grid-column: 2 !important;
  grid-row: 2 !important;
  margin-top: 3px !important;
  color: #5a4630 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
  min-width: 0 !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

.Content #rules .abyss-rules-rule__details {
  margin: 0 12px 14px 50px !important;
  padding: 14px 16px !important;
  border: 1px solid rgba(116, 88, 47, .38) !important;
  border-radius: 3px !important;
  background: rgba(192, 170, 132, .62) !important;
  color: #3b2817 !important;
}

.Content #rules .abyss-rules-footer {
  padding: 20px 24px !important;
  border-top: 2px solid #c99725 !important;
  border-radius: 0 0 4px 4px !important;
}

.Content #rules .abyss-rules-footer p {
  margin: 0 0 16px !important;
}

.Content #rules .abyss-rules-footer p:last-child {
  margin-bottom: 0 !important;
}

.Content #rules .abyss-rules-empty {
  margin: 0 !important;
  padding: 10px !important;
}

@media (max-width: 720px) {
  .Content #rules .abyss-rules-page {
    padding: 12px 10px 20px !important;
  }

  .Content #rules .abyss-rules-intro__body,
  .Content #rules .abyss-rules-category__body,
  .Content #rules .abyss-rules-footer {
    padding-right: 12px !important;
    padding-left: 12px !important;
  }

  .Content #rules .abyss-rules-rule__details {
    margin-left: 16px !important;
  }
}

/* Abyssal guild view polish. */
.Content #guilds > .BoxContent > table:first-child h1,
.Content #guilds .BoxContent > table:first-child h1 {
  margin: 18px 0 20px !important;
  color: #3f2613 !important;
  font-size: 28px !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-shadow: 0 1px 0 rgba(255, 242, 205, .55) !important;
}

.Content #guilds .BoxContent > table,
.Content #guilds .TableContainer,
.Content #guilds .Table1,
.Content #guilds .Table3,
.Content #guilds .InnerTableContainer,
.Content #guilds .TableContentContainer,
.Content #guilds .TableContentAndRightShadow {
  background: #e2d8c4 !important;
  border-color: rgba(168, 151, 121, .72) !important;
  box-shadow: none !important;
}

.Content #guilds .CaptionContainer,
.Content #guilds .CaptionInnerContainer,
.Content #guilds .LabelH,
.Content #guilds .LabelH > td,
.Content #guilds tr.LabelH > td {
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  border-top: 1px solid rgba(247, 214, 137, .72) !important;
  border-bottom: 1px solid rgba(88, 18, 7, .88) !important;
  color: #fff4c7 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content #guilds .CaptionContainer .Text,
.Content #guilds .CaptionContainer .Text *,
.Content #guilds .LabelH *,
.Content #guilds tr.LabelH > td * {
  color: #fff4c7 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content #guilds .CaptionContainer span {
  display: none !important;
}

.Content #guilds .CaptionContainer .Text {
  display: block !important;
  min-height: 28px !important;
  padding: 0 12px !important;
  font-size: 14px !important;
  line-height: 28px !important;
  text-transform: uppercase !important;
}

.Content #guilds .TableContent,
.Content #guilds .Table1,
.Content #guilds .Table3 {
  width: 100% !important;
  border-collapse: collapse !important;
}

.Content #guilds .TableContent td,
.Content #guilds tr[bgcolor] > td {
  padding: 8px 10px !important;
  border-bottom: 1px solid rgba(168, 151, 121, .28) !important;
  background: #f3ead6 !important;
  color: #3a210e !important;
  line-height: 1.28 !important;
  vertical-align: middle !important;
}

.Content #guilds .TableContent tr:nth-child(even):not(.LabelH) > td,
.Content #guilds tr:nth-child(even)[bgcolor] > td {
  background: #e7dcc4 !important;
}

.Content #guilds .TableContent tr.LabelH,
.Content #guilds .TableContent tr.LabelH > td,
.Content #guilds .TableContent tr.LabelH > th {
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  background-image: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  border-top: 1px solid rgba(247, 214, 137, .72) !important;
  border-bottom: 1px solid rgba(88, 18, 7, .88) !important;
  color: #fff4c7 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content #guilds .TableContent tr.LabelH,
.Content #guilds .TableContent tr.LabelH > td *,
.Content #guilds .TableContent tr.LabelH > th * {
  color: #fff4c7 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content #guilds #GuildInformationContainer {
  padding: 2px 0 !important;
  color: #3a210e !important;
  line-height: 1.45 !important;
}

.Content #guilds #GuildInformationContainer b,
.Content #guilds .TableContent b {
  color: #3f2613 !important;
  font-weight: 900 !important;
}

.Content #guilds .fixed {
  width: auto !important;
  margin: 10px auto 8px !important;
  border-collapse: separate !important;
  border-spacing: 4px 0 !important;
}

.Content #guilds .fixed colgroup {
  display: none !important;
}

.Content #guilds .fixed td {
  width: auto !important;
  padding: 0 !important;
}

.Content #guilds a .BigButton,
.Content #guilds form .BigButton {
  width: 108px !important;
  height: 28px !important;
  min-width: 108px !important;
  max-width: 108px !important;
  display: inline-block !important;
  overflow: hidden !important;
  border-color: rgba(216, 168, 75, .74) !important;
  background: linear-gradient(180deg, #0d3765, #04101d) !important;
  background-image: linear-gradient(180deg, #0d3765, #04101d) !important;
  box-shadow: none !important;
}

.Content #guilds a .BigButton:hover,
.Content #guilds form .BigButton:hover,
.Content #guilds a:focus .BigButton,
.Content #guilds form:focus-within .BigButton {
  background: linear-gradient(180deg, #0f4e91, #051726) !important;
  box-shadow: none !important;
}

.Content #guilds .BigButton > div {
  width: 100% !important;
  height: 100% !important;
  background: none !important;
  background-image: none !important;
  box-shadow: none !important;
}

.Content #guilds .BigButtonOver {
  display: none !important;
}

.Content #guilds .BigButtonText {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  outline: 0 !important;
  color: #fff4c7 !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
  text-transform: uppercase !important;
}

.Content #guilds .abyss-guilds-action {
  text-align: center !important;
}

.Content #guilds .abyss-guilds-action table {
  width: auto !important;
  margin: 0 auto !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.Content #guilds .abyss-guilds-action table td {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: center !important;
}

.Content #guilds .abyss-guilds-button-form {
  display: inline-block !important;
  width: auto !important;
  margin: 0 auto !important;
}

.Content #guilds .abyss-guilds-action .BigButton {
  width: 92px !important;
  min-width: 92px !important;
  max-width: 92px !important;
  height: 28px !important;
}

.Content #guilds .abyss-guilds-action .BigButtonText {
  display: block !important;
  width: 100% !important;
  height: 28px !important;
  padding: 0 !important;
  font-size: 11px !important;
  line-height: 28px !important;
  text-align: center !important;
  text-indent: 0 !important;
}

.Content #guilds .input_nick {
  width: 100% !important;
  min-height: 28px !important;
  min-width: 0 !important;
  margin: 0 !important;
  border: 1px solid rgba(92, 61, 27, .72) !important;
  border-radius: 3px !important;
  background: #fff8e8 !important;
  color: #3a210e !important;
}

.Content #guilds .btn_nick {
  width: 82px !important;
  height: 28px !important;
  border: 1px solid rgba(216, 168, 75, .74) !important;
  border-radius: 4px !important;
  background: linear-gradient(180deg, #0d3765, #04101d) !important;
  background-image: linear-gradient(180deg, #0d3765, #04101d) !important;
  box-shadow: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  color: #fff4c7 !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 26px !important;
  text-align: center !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content #guilds .btn_nick:hover,
.Content #guilds .btn_nick:focus {
  background: linear-gradient(180deg, #0f4e91, #051726) !important;
  background-image: linear-gradient(180deg, #0f4e91, #051726) !important;
  box-shadow: none !important;
  outline: 0 !important;
}

.Content #guilds .abyss-guild-member-name-form {
  display: grid !important;
  grid-template-columns: auto minmax(220px, 1fr) auto !important;
  align-items: center !important;
  gap: 6px !important;
  width: 100% !important;
  margin: 0 !important;
}

.Content #guilds .abyss-guild-player-link {
  white-space: nowrap !important;
  font-weight: 900 !important;
}

.Content #guilds .abyss-guild-nick-edit {
  display: grid !important;
  grid-template-columns: auto minmax(120px, 1fr) auto auto !important;
  align-items: center !important;
  gap: 4px !important;
  min-width: 0 !important;
  max-width: 500px !important;
}

.Content #guilds .abyss-guild-nick-paren {
  color: #3f2613 !important;
  line-height: 28px !important;
}

.Content #guilds .abyss-guild-kick-link {
  justify-self: end !important;
  font-size: 10px !important;
  white-space: nowrap !important;
}

.Content #guilds .abyss-guild-form {
  margin: 0 0 12px !important;
}

.Content #guilds .abyss-guild-form .CaptionInnerContainer {
  min-height: 28px !important;
}

.Content #guilds .abyss-guild-form form,
.Content #guilds .abyss-guild-actions form {
  display: inline-block !important;
  width: auto !important;
  margin: 0 4px 6px !important;
  vertical-align: middle !important;
}

.Content #guilds .abyss-guild-actions {
  clear: both !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  margin: 10px 0 12px !important;
  text-align: center !important;
}

.Content #guilds .abyss-guild-panel-actions {
  display: flex !important;
  min-height: 0 !important;
  height: auto !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 6px 0 8px !important;
}

.Content #guilds .abyss-guild-panel-actions > div[style*="height"] {
  display: none !important;
}

.Content #guilds .abyss-guild-panel-actions a {
  display: inline-block !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

.Content #guilds .abyss-guild-button-cell {
  width: 124px !important;
  text-align: center !important;
}

.Content #guilds .abyss-guild-radio {
  display: block !important;
  margin: 4px 0 !important;
  color: #3f2613 !important;
  font-weight: 700 !important;
}

.Content #guilds textarea {
  width: min(100%, 620px) !important;
  min-height: 110px !important;
  resize: vertical !important;
}

.Content #guilds :is(input[type="text"], input[type="number"], input[type="file"], select, textarea) {
  border: 1px solid rgba(92, 61, 27, .72) !important;
  border-radius: 3px !important;
  background: #fff8e8 !important;
  color: #3a210e !important;
}

.Content #guilds :is(input[type="text"], input[type="number"], select) {
  min-height: 26px !important;
}

.Content #guilds :is(input[type="submit"]:not(.BigButtonText), button) {
  width: auto !important;
}

.Content #guilds .BigButtonText[type="submit"] {
  width: 100% !important;
  height: 100% !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

/* Abyssal team/support page. */
.Content #team .abyss-team-heading {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 18px !important;
  margin: 16px 0 22px !important;
  color: #3f2613 !important;
  font-size: 17px !important;
  font-weight: 900 !important;
  letter-spacing: 1px !important;
  text-align: center !important;
}

.Content #team .abyss-team-heading img {
  width: auto !important;
  height: auto !important;
}

.Content #team .abyss-team-section {
  margin: 0 0 18px !important;
  background: #e2d8c4 !important;
  border-color: rgba(168, 151, 121, .72) !important;
  box-shadow: none !important;
}

.Content #team .abyss-team-section .CaptionContainer,
.Content #team .abyss-team-section .CaptionInnerContainer,
.Content #team .abyss-team-table tr.LabelH,
.Content #team .abyss-team-table tr.LabelH > td,
.Content #team .abyss-team-table tr.LabelH > th {
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  background-image: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  color: #fff4c7 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content #team .abyss-team-section .CaptionContainer span {
  display: none !important;
}

.Content #team .abyss-team-section .CaptionContainer .Text {
  display: block !important;
  min-height: 28px !important;
  padding: 0 12px !important;
  color: #fff4c7 !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 28px !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
  text-transform: uppercase !important;
}

.Content #team .abyss-team-table {
  width: 100% !important;
  border-collapse: collapse !important;
}

.Content #team .abyss-team-table td,
.Content #team .abyss-team-table th {
  padding: 9px 10px !important;
  border-bottom: 1px solid rgba(168, 151, 121, .28) !important;
  background: #f3ead6 !important;
  color: #3a210e !important;
  line-height: 1.25 !important;
  vertical-align: middle !important;
}

.Content #team .abyss-team-table tr:nth-child(even):not(.LabelH) > td {
  background: #e7dcc4 !important;
}

.Content #team .abyss-team-table tr.LabelH > td,
.Content #team .abyss-team-table tr.LabelH > th {
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  color: #fff4c7 !important;
}

.Content #team .abyss-team-rank,
.Content #team .abyss-team-name a {
  color: #0065b8 !important;
  font-weight: 900 !important;
}

.Content #team .abyss-team-status {
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(255, 242, 205, .45) !important;
}

.Content #team .abyss-team-status--online {
  color: #11790c !important;
}

.Content #team .abyss-team-status--offline {
  color: #b00000 !important;
}

.Content #team .abyss-team-login {
  text-align: center !important;
  white-space: nowrap !important;
}

.Content #team .abyss-team-outfit,
.Content #team .abyss-team-outfit-head {
  width: 52px !important;
  text-align: center !important;
}

.Content #team .abyss-team-outfit img {
  max-width: 48px !important;
  max-height: 48px !important;
}

.Content #polls.Box .BoxContent .abyss-polls-detail > .abyss-polls-detail__caption,
.Content #polls.Box .BoxContent .abyss-polls-detail > .abyss-polls-detail__caption * {
  color: #ffe19b !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .95) !important;
}

/* Abyssal character profile page. */
.Content #characters :is(.TableContainer, .Table3, .InnerTableContainer, .TableContentContainer, .TableContent) {
  background: #e2d8c4 !important;
  border-color: rgba(168, 151, 121, .72) !important;
  box-shadow: none !important;
}

.Content #characters :is(.CaptionContainer, .CaptionInnerContainer),
.Content #characters :is(.LabelH, .LabelH td, th, td.white),
.Content #characters tr[bgcolor="#505050"] > td,
.Content #characters tr[bgcolor="#505050"] > th {
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  background-image: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  color: #fff4c7 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content #characters .CaptionContainer span {
  display: none !important;
}

.Content #characters .CaptionContainer .Text {
  display: block !important;
  min-height: 28px !important;
  padding: 0 12px !important;
  color: #fff4c7 !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 28px !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
  text-transform: uppercase !important;
}

.Content #characters :is(.TableContent td, td[bgcolor], tr[bgcolor] > td) {
  background: #f3ead6 !important;
  color: #3a210e !important;
  line-height: 1.25 !important;
}

.Content #characters .TableContent tr:nth-child(even) > td {
  background: #e7dcc4 !important;
}

.Content #characters .TableContent tr.LabelH > td,
.Content #characters .TableContent tr.LabelH > th {
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  background-image: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  color: #fff4c7 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content #characters .TableContent tr.LabelH > td *,
.Content #characters .TableContent tr.LabelH > th * {
  color: #fff4c7 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content #characters :is(.LabelV, .LabelV80, .LabelV100, .LabelV120, .LabelV175) {
  color: #3f2613 !important;
  font-weight: 900 !important;
}

.Content #characters :is(input[type="text"], input[type="password"], select, textarea) {
  border: 1px solid rgba(92, 61, 27, .72) !important;
  border-radius: 3px !important;
  background: #fff8e8 !important;
  color: #3a210e !important;
  box-shadow: none !important;
}

.Content #characters .abyss-character-details-inventory-cell {
  width: 154px !important;
  padding: 10px 8px !important;
  vertical-align: top !important;
}

.Content #characters .abyss-character-inventory {
  width: 132px !important;
  margin: 0 auto !important;
  padding: 8px !important;
  border: 1px solid rgba(92, 61, 27, .45) !important;
  border-radius: 4px !important;
  background: #e7dcc4 !important;
  box-shadow: inset 0 0 0 1px rgba(255, 244, 199, .35) !important;
}

.Content #characters .abyss-character-inventory__title {
  margin: 0 0 7px !important;
  color: #3f2613 !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  text-align: center !important;
}

.Content #characters .abyss-character-inventory__grid {
  display: grid !important;
  grid-template-columns: repeat(3, 38px) !important;
  grid-auto-rows: 38px !important;
  gap: 4px !important;
  justify-content: center !important;
}

.Content #characters .abyss-character-slot {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 38px !important;
  height: 38px !important;
  padding: 0 !important;
  border: 1px solid rgba(216, 168, 75, .42) !important;
  border-radius: 3px !important;
  background: #1b1712 !important;
  box-shadow: inset 0 0 7px rgba(0, 0, 0, .72) !important;
}

.Content #characters .abyss-character-slot img {
  display: block !important;
  max-width: 34px !important;
  max-height: 34px !important;
}

.Content #characters .abyss-character-slot--empty {
  background: rgba(35, 27, 18, .72) !important;
}

.Content #characters .abyss-character-inventory__stats {
  display: flex !important;
  justify-content: space-between !important;
  gap: 8px !important;
  margin-top: 7px !important;
  color: #3f2613 !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
}

.Content #characters .progress {
  height: 15px !important;
  margin: 3px 0 0 !important;
  border: 1px solid rgba(54, 37, 21, .72) !important;
  border-radius: 3px !important;
  background: #f8efd9 !important;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .35) !important;
  overflow: hidden !important;
}

.Content #characters .progress-bar {
  height: 100% !important;
  border-radius: 2px !important;
}

.Content #characters .bg-danger {
  background: linear-gradient(180deg, #f04f5d, #c91d2e) !important;
}

.Content #characters .bg-default {
  background: linear-gradient(180deg, #1a95ff, #006fd1) !important;
}

.Content #characters .bg-success {
  background: linear-gradient(180deg, #8fc96a, #3d8b35) !important;
}

.Content #characters .abyss-character-actions-cell {
  width: 112px !important;
  text-align: center !important;
}

.Content #characters .abyss-character-actions {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  width: auto !important;
  margin: 0 !important;
}

.Content #characters .BigButton {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 96px !important;
  min-width: 96px !important;
  max-width: 96px !important;
  height: 28px !important;
  margin: 0 auto !important;
  border: 1px solid rgba(216, 168, 75, .74) !important;
  border-radius: 4px !important;
  background: linear-gradient(180deg, #0d3765, #04101d) !important;
  background-image: linear-gradient(180deg, #0d3765, #04101d) !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

.Content #characters .BigButton:hover,
.Content #characters .BigButton:focus-within {
  background: linear-gradient(180deg, #0f4e91, #051726) !important;
  background-image: linear-gradient(180deg, #0f4e91, #051726) !important;
}

.Content #characters .BigButton > div {
  width: 100% !important;
  height: 100% !important;
  background: none !important;
  background-image: none !important;
  box-shadow: none !important;
}

.Content #characters .BigButtonOver {
  display: none !important;
}

.Content #characters .BigButtonText {
  position: static !important;
  display: block !important;
  width: 100% !important;
  height: 28px !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #fff4c7 !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 28px !important;
  text-align: center !important;
  text-indent: 0 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
  text-transform: uppercase !important;
}

.Content #characters .btn_clipboard {
  min-width: 66px !important;
  height: 26px !important;
  border: 1px solid rgba(216, 168, 75, .74) !important;
  border-radius: 4px !important;
  background: linear-gradient(180deg, #0d3765, #04101d) !important;
  color: #fff4c7 !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

/* Abyssal highscores page. */
.Content #highscores :is(.TableContainer, .Table3, .InnerTableContainer, .TableContentContainer, .TableContent),
.Content #highscores .abyss-highscores-layout,
.Content #highscores .abyss-highscores-table,
.Content #highscores .abyss-highscores-filter {
  background: #e2d8c4 !important;
  border-color: rgba(168, 151, 121, .72) !important;
  box-shadow: none !important;
}

.Content #highscores :is(.CaptionContainer, .CaptionInnerContainer),
.Content #highscores .abyss-highscores-table tr.LabelH > td,
.Content #highscores .abyss-highscores-table tr.LabelH > th,
.Content #highscores .abyss-highscores-filter tr:first-child > td {
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  background-image: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  color: #fff4c7 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content #highscores .CaptionContainer span {
  display: none !important;
}

.Content #highscores .CaptionContainer .Text {
  display: block !important;
  min-height: 28px !important;
  padding: 0 12px !important;
  color: #fff4c7 !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 28px !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
  text-transform: uppercase !important;
}

.Content #highscores .abyss-highscores-title {
  margin: 8px 0 14px !important;
  text-align: center !important;
}

.Content #highscores .abyss-highscores-title h2 {
  margin: 0 !important;
  color: #3f2613 !important;
  font-size: 19px !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  text-shadow: none !important;
}

.Content #highscores .abyss-highscores-layout > tbody > tr > td {
  background: #e2d8c4 !important;
  color: #3a210e !important;
  vertical-align: top !important;
}

.Content #highscores .abyss-highscores-spacer {
  width: 10px !important;
  padding: 0 !important;
  background: transparent !important;
}

.Content #highscores .abyss-highscores-gap {
  width: 28px !important;
  min-width: 28px !important;
  padding: 0 !important;
  background: #e2d8c4 !important;
}

.Content #highscores .abyss-highscores-main {
  width: auto !important;
  padding: 0 !important;
}

.Content #highscores .abyss-highscores-sidebar {
  width: 140px !important;
  min-width: 140px !important;
  max-width: 140px !important;
  padding: 70px 0 0 !important;
}

.Content #highscores .abyss-highscores-table {
  border: 1px solid rgba(168, 151, 121, .72) !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  table-layout: fixed !important;
}

.Content #highscores .abyss-highscores-table td,
.Content #highscores .abyss-highscores-table th {
  padding: 8px 10px !important;
  border-bottom: 1px solid rgba(168, 151, 121, .28) !important;
  color: #3a210e !important;
  line-height: 1.25 !important;
  vertical-align: middle !important;
}

.Content #highscores .abyss-highscores-table tr:not(.LabelH):nth-child(odd) > td {
  background: #f3ead6 !important;
}

.Content #highscores .abyss-highscores-table tr:not(.LabelH):nth-child(even) > td {
  background: #e7dcc4 !important;
}

.Content #highscores .abyss-highscores-table tr.LabelH > td,
.Content #highscores .abyss-highscores-table tr.LabelH > td *,
.Content #highscores .abyss-highscores-table tr.LabelH > th,
.Content #highscores .abyss-highscores-table tr.LabelH > th * {
  color: #fff4c7 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content #highscores .abyss-highscores-table td:nth-child(1),
.Content #highscores .abyss-highscores-table td:nth-child(3),
.Content #highscores .abyss-highscores-table td:nth-child(4) {
  text-align: center !important;
}

.Content #highscores .abyss-highscores-table td:nth-child(4) {
  white-space: nowrap !important;
  font-size: 12px !important;
}

.Content #highscores .abyss-highscores-table td:nth-child(2) {
  text-align: left !important;
}

.Content #highscores .abyss-highscores-table a {
  color: #0065b8 !important;
  font-weight: 900 !important;
  text-decoration: none !important;
}

.Content #highscores .abyss-highscores-table a:hover {
  color: #004c8c !important;
  text-decoration: underline !important;
}

.Content #highscores .abyss-highscores-table small {
  color: #6c421f !important;
  font-weight: 700 !important;
}

.Content #highscores .abyss-highscores-filter {
  margin: 0 0 14px !important;
  border: 1px solid rgba(168, 151, 121, .72) !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  width: 140px !important;
  table-layout: fixed !important;
}

.Content #highscores .abyss-highscores-filter td {
  padding: 8px 9px !important;
  background: #f3ead6 !important;
  color: #3a210e !important;
  line-height: 1.35 !important;
}

.Content #highscores .abyss-highscores-filter tr:first-child > td,
.Content #highscores .abyss-highscores-filter tr:first-child > td * {
  color: #fff4c7 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content #highscores .abyss-highscores-filter a {
  display: block !important;
  padding: 2px 0 !important;
  color: #0065b8 !important;
  font-weight: 900 !important;
  text-decoration: none !important;
}

.Content #highscores .abyss-highscores-filter a:hover {
  color: #004c8c !important;
  text-decoration: underline !important;
}

/* Abyssal spells pages. */
.Content #spells .BoxContent,
.Content #spells :is(.TableContainer, .Table2, .InnerTableContainer, .TableContentContainer, .TableContent),
.Content #spells .abyss-spells-table {
  background: #e2d8c4 !important;
  border-color: rgba(168, 151, 121, .72) !important;
  box-shadow: none !important;
}

.Content #spells :is(.CaptionContainer, .CaptionInnerContainer),
.Content #spells :is(.LabelH, .LabelH td, .LabelH th),
.Content #spells .abyss-spells-table tr.LabelH > td,
.Content #spells .abyss-spells-table tr.LabelH > th {
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  background-image: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  color: #fff4c7 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content #spells .CaptionContainer span {
  display: none !important;
}

.Content #spells .CaptionContainer .Text {
  display: block !important;
  min-height: 28px !important;
  padding: 0 12px !important;
  color: #fff4c7 !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 28px !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
  text-transform: uppercase !important;
}

.Content #spells .abyss-spells-intro {
  margin: 0 0 12px !important;
  color: #3a210e !important;
  line-height: 1.35 !important;
}

.Content #spells .abyss-spells-table {
  border: 1px solid rgba(168, 151, 121, .72) !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  table-layout: fixed !important;
}

.Content #spells :is(.TableContent td, td[bgcolor], tr[bgcolor] > td),
.Content #spells .abyss-spells-table td {
  padding: 6px 8px !important;
  background: #f3ead6 !important;
  color: #3a210e !important;
  line-height: 1.25 !important;
  vertical-align: middle !important;
}

.Content #spells :is(.TableContent tr:nth-child(even) td, .abyss-spells-table tr:nth-child(even):not(.LabelH) > td) {
  background: #e7dcc4 !important;
}

.Content #spells tr.LabelH > td,
.Content #spells tr.LabelH > td *,
.Content #spells tr.LabelH > th,
.Content #spells tr.LabelH > th * {
  color: #fff4c7 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
}

.Content #spells :is(.LabelV, .LabelV175, label, b) {
  color: #3f2613 !important;
  font-weight: 900 !important;
}

.Content #spells a {
  color: #0065b8 !important;
  font-weight: 900 !important;
  text-decoration: none !important;
}

.Content #spells a:hover {
  color: #004c8c !important;
  text-decoration: underline !important;
}

.Content #spells :is(input[type="radio"], select) {
  vertical-align: middle !important;
}

.Content #spells select {
  min-height: 26px !important;
  border: 1px solid rgba(92, 61, 27, .72) !important;
  border-radius: 3px !important;
  background: #fff8e8 !important;
  color: #3a210e !important;
}

.Content #spells .BigButton {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 96px !important;
  min-width: 96px !important;
  max-width: 96px !important;
  height: 28px !important;
  margin: 0 auto !important;
  border: 1px solid rgba(216, 168, 75, .74) !important;
  border-radius: 4px !important;
  background: linear-gradient(180deg, #0d3765, #04101d) !important;
  background-image: linear-gradient(180deg, #0d3765, #04101d) !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

.Content #spells .BigButton > div {
  width: 100% !important;
  height: 100% !important;
  background: none !important;
  background-image: none !important;
}

.Content #spells .BigButtonOver {
  display: none !important;
}

.Content #spells .BigButtonText {
  position: static !important;
  display: block !important;
  width: 100% !important;
  height: 28px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #fff4c7 !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 28px !important;
  text-align: center !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .9) !important;
  text-transform: uppercase !important;
}

.abyss-twofa-page {
  color: #3f2613;
}

.abyss-twofa-alert {
  margin: 0 0 10px;
  padding: 9px 12px;
  border-radius: 4px;
  font-weight: 800;
}

.abyss-twofa-alert--success {
  background: #d7ead0;
  border: 1px solid #6f9a5c;
  color: #174a16;
}

.abyss-twofa-alert--error {
  background: #ead0c8;
  border: 1px solid #9b3f2f;
  color: #6e130d;
}

.abyss-twofa-form {
  margin: 12px 0 0;
}

.abyss-twofa-grid {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  gap: 8px 12px;
  align-items: center;
  margin: 12px 0;
}

.abyss-twofa-grid label {
  color: #3f2613;
  font-weight: 900;
}

.abyss-twofa-grid input {
  width: 100%;
  box-sizing: border-box;
  min-height: 30px;
  border: 1px solid #9d7d4d;
  background: #fff7e5;
  color: #2b170b;
  font-weight: 700;
  padding: 5px 8px;
}

.abyss-twofa-setup {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
  margin: 14px 0;
}

.abyss-twofa-qr {
  width: 220px;
  min-height: 220px;
  padding: 10px;
  background: #f3ead6;
  border: 1px solid #b9a06f;
  text-align: center;
}

.abyss-twofa-qr img {
  display: block;
  width: 220px;
  height: 220px;
}

.abyss-twofa-secret {
  display: inline-block;
  max-width: 100%;
  margin: 3px 0 8px;
  padding: 7px 10px;
  border: 1px solid #b9a06f;
  background: #f3ead6;
  color: #2b170b;
  font-family: Consolas, Monaco, monospace;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0;
  word-break: break-all;
}

.abyss-button-link {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: auto !important;
  min-width: 110px;
  height: 28px;
  padding: 0 16px !important;
  box-sizing: border-box;
  text-decoration: none !important;
}

.abyss-account-actions .abyss-action-twofa {
  margin-top: 4px;
}

@media (max-width: 700px) {
  .abyss-twofa-grid,
  .abyss-twofa-setup {
    grid-template-columns: 1fr;
  }

  .abyss-twofa-qr {
    margin: 0 auto;
  }
}

.Content #accountmanagement .abyss-twofa-page,
.Content #accountmanagement .abyss-twofa-page :is(p, div, span, label) {
  color: #3a210e !important;
  font-family: Verdana, Arial, sans-serif !important;
}

.Content #accountmanagement .abyss-twofa-page .abyss-public-panel {
  overflow: hidden !important;
  border: 1px solid rgba(168, 151, 121, .72) !important;
  border-radius: 6px !important;
  background: #e2d8c4 !important;
  box-shadow: none !important;
}

.Content #accountmanagement .abyss-twofa-page .abyss-public-panel__caption {
  min-height: 28px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 12px !important;
  border-top: 1px solid rgba(247, 214, 137, .72) !important;
  border-bottom: 1px solid rgba(88, 18, 7, .88) !important;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  color: #fff4c7 !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 28px !important;
  text-align: center !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .92) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 232, 166, .38),
    inset 0 -1px 0 rgba(43, 9, 3, .82) !important;
}

.Content #accountmanagement .abyss-twofa-page .abyss-public-panel__body {
  padding: 12px 14px 14px !important;
  background: #e2d8c4 !important;
  color: #3a210e !important;
}

.Content #accountmanagement .abyss-twofa-status {
  margin: 0 0 8px !important;
  padding: 8px 10px !important;
  border: 1px solid rgba(168, 151, 121, .42) !important;
  background: #f3ead6 !important;
}

.Content #accountmanagement .abyss-twofa-label,
.Content #accountmanagement .abyss-twofa-page strong {
  color: #3f2613 !important;
  font-weight: 900 !important;
}

.Content #accountmanagement .abyss-twofa-status__on {
  color: #17641d !important;
  font-weight: 900 !important;
}

.Content #accountmanagement .abyss-twofa-status__off {
  color: #7e1510 !important;
  font-weight: 900 !important;
}

.Content #accountmanagement .abyss-twofa-alert {
  margin: 0 0 10px !important;
  padding: 9px 11px !important;
  border-radius: 3px !important;
  font-weight: 900 !important;
}

.Content #accountmanagement .abyss-twofa-alert--error {
  border: 1px solid rgba(126, 21, 16, .72) !important;
  background: #ead8cf !important;
  color: #5f140e !important;
}

.Content #accountmanagement .abyss-twofa-alert--success {
  border: 1px solid rgba(55, 112, 40, .72) !important;
  background: #d8e8ce !important;
  color: #214d16 !important;
}

.Content #accountmanagement .abyss-twofa-grid label {
  color: #3f2613 !important;
  font-weight: 900 !important;
}

.Content #accountmanagement .abyss-twofa-grid input {
  border: 1px solid rgba(92, 61, 27, .72) !important;
  background: #fff8e8 !important;
  color: #3a210e !important;
}

.Content #accountmanagement .abyss-twofa-page .abyss-public-actions {
  display: flex !important;
  justify-content: center !important;
  gap: 8px !important;
  margin-top: 10px !important;
}

.Content #accountmanagement .abyss-twofa-page .abyss-compact-button,
.Content #accountmanagement .abyss-twofa-page a.abyss-compact-button,
.Content #accountmanagement .abyss-twofa-page button.abyss-compact-button {
  min-width: 116px !important;
  height: 26px !important;
  border-color: rgba(216, 168, 75, .9) !important;
  background: linear-gradient(180deg, #0d3765 0%, #082a4e 42%, #04101d 100%) !important;
  color: #fff4c7 !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 26px !important;
  text-decoration: none !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .95) !important;
  text-transform: uppercase !important;
}

.Content #accountmanagement .abyss-twofa-page .abyss-compact-button:hover,
.Content #accountmanagement .abyss-twofa-page .abyss-compact-button:focus-visible {
  background: linear-gradient(180deg, #155080 0%, #0b3766 42%, #061827 100%) !important;
  color: #fff4c7 !important;
}

.Content .BoxContent .abyss-social-register-panel .abyss-social-register-caption,
.Content .BoxContent .abyss-social-register-panel .abyss-social-register-caption * {
  color: #ffe19b !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-weight: 900 !important;
  text-shadow:
    0 1px 0 rgba(38, 11, 4, .95),
    0 0 8px rgba(255, 210, 104, .42) !important;
}

.Content .BoxContent .abyss-social-button--discord,
.Content .BoxContent .abyss-social-button--discord *,
.Content .BoxContent .abyss-social-button--discord i:before {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* Abyssal menu art pass 2026-05-30: independent framed buttons and Community spin. */
#MenuColumn {
  --abyss-menu-gold-bright: #f2c96d;
  --abyss-menu-gold: #d29a3d;
  --abyss-menu-gold-dark: #7a4716;
  --abyss-menu-blue-top: #0a4163;
  --abyss-menu-blue-mid: #082743;
  --abyss-menu-blue-bottom: #020912;
  --abyss-menu-cyan: #1bbcff;
}

#Menu.abyss-menu-art {
  width: 304px !important;
  max-width: 304px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background: transparent !important;
}

#Menu.abyss-menu-art .menuitem,
#Menu.abyss-menu-art #news,
#Menu.abyss-menu-art #account,
#Menu.abyss-menu-art #community,
#Menu.abyss-menu-art #library,
#Menu.abyss-menu-art #shops {
  width: 304px !important;
  margin: 0 auto 11px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

#Menu.abyss-menu-art .menuitem::before,
#Menu.abyss-menu-art .menuitem::after {
  content: none !important;
  display: none !important;
}

#Menu.abyss-menu-art .MenuButton {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 304px !important;
  height: 64px !important;
  min-height: 64px !important;
  margin: 0 0 8px !important;
  padding: 0 58px 0 50px !important;
  border: 2px solid rgba(242, 201, 109, .78) !important;
  border-radius: 8px !important;
  background:
    linear-gradient(135deg, rgba(255, 236, 168, .38) 0 1px, transparent 1px 100%),
    radial-gradient(circle at 18% 50%, rgba(27, 188, 255, .22), transparent 28%),
    radial-gradient(circle at 82% 50%, rgba(27, 188, 255, .20), transparent 28%),
    linear-gradient(180deg, rgba(12, 73, 108, .98), rgba(4, 26, 47, .99) 48%, rgba(1, 8, 17, .99)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(60, 25, 4, .86),
    inset 0 2px 0 rgba(255, 232, 157, .36),
    inset 0 -2px 0 rgba(45, 21, 4, .86),
    inset 0 0 19px rgba(0, 0, 0, .62),
    0 0 0 1px rgba(48, 18, 3, .88),
    0 7px 12px rgba(0, 0, 0, .55),
    0 0 12px rgba(0, 162, 255, .18) !important;
  cursor: pointer !important;
  filter: drop-shadow(0 0 4px rgba(210, 154, 61, .28)) !important;
  overflow: visible !important;
}

#Menu.abyss-menu-art .MenuButton::before {
  content: "" !important;
  position: absolute !important;
  inset: 9px 31px !important;
  z-index: 1 !important;
  height: auto !important;
  border: 1px solid rgba(242, 201, 109, .36) !important;
  border-radius: 3px !important;
  background:
    linear-gradient(115deg, transparent 0 12%, rgba(255, 219, 103, .22) 12.5% 13.2%, transparent 13.7% 100%),
    linear-gradient(35deg, transparent 0 48%, rgba(27, 188, 255, .18) 48.4% 49.2%, transparent 49.6% 100%),
    linear-gradient(145deg, rgba(0, 0, 0, .12), transparent 44%, rgba(0, 0, 0, .30)),
    linear-gradient(180deg, var(--abyss-menu-blue-top), var(--abyss-menu-blue-mid) 48%, var(--abyss-menu-blue-bottom)) !important;
  box-shadow:
    inset 0 0 15px rgba(0, 0, 0, .72),
    inset 0 0 18px rgba(0, 166, 255, .16),
    0 0 7px rgba(0, 166, 255, .18) !important;
}

#Menu.abyss-menu-art .MenuButton::after {
  content: attr(data-title) !important;
  position: relative !important;
  z-index: 5 !important;
  display: block !important;
  width: 100% !important;
  color: #ffe49a !important;
  -webkit-text-fill-color: #ffe49a !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  line-height: 64px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  text-shadow:
    0 2px 0 rgba(40, 12, 2, .96),
    0 0 6px rgba(255, 211, 91, .58),
    0 0 2px rgba(0, 0, 0, .95) !important;
}

#Menu.abyss-menu-art .MenuButton > div {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 3 !important;
  pointer-events: none !important;
}

#Menu.abyss-menu-art .MenuButton .Button,
#Menu.abyss-menu-art .MenuButton .Extend,
#Menu.abyss-menu-art .MenuButton .Icon {
  display: block !important;
  position: absolute !important;
  opacity: 1 !important;
}

#Menu.abyss-menu-art .MenuButton .Button,
#Menu.abyss-menu-art .MenuButton .Extend {
  top: 12px !important;
  width: 32px !important;
  height: 40px !important;
  border: 1px solid rgba(255, 229, 142, .56) !important;
  background:
    linear-gradient(135deg, rgba(255, 232, 157, .90), rgba(174, 108, 28, .94) 44%, rgba(72, 35, 5, .96)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(73, 27, 3, .76),
    inset 0 1px 0 rgba(255, 245, 207, .46),
    0 0 7px rgba(210, 154, 61, .36) !important;
}

#Menu.abyss-menu-art .MenuButton .Button {
  left: 1px !important;
  clip-path: polygon(0 50%, 38% 0, 100% 0, 74% 50%, 100% 100%, 38% 100%);
}

#Menu.abyss-menu-art .MenuButton .Extend {
  right: 1px !important;
  clip-path: polygon(0 0, 62% 0, 100% 50%, 62% 100%, 0 100%, 26% 50%);
  transform: none !important;
}

#Menu.abyss-menu-art .MenuButton .Icon {
  right: 8px !important;
  top: 18px !important;
  z-index: 6 !important;
  width: 28px !important;
  height: 28px !important;
  border: 2px solid rgba(242, 201, 109, .86) !important;
  background:
    radial-gradient(circle at 50% 50%, rgba(90, 221, 255, .98) 0 22%, rgba(5, 72, 128, .98) 23% 52%, rgba(3, 15, 31, .98) 53% 100%) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 244, 203, .28),
    0 0 8px rgba(27, 188, 255, .72),
    0 0 5px rgba(242, 201, 109, .46) !important;
  transform: translateY(-50%) rotate(45deg) !important;
}

#Menu.abyss-menu-art .MenuButton .Icon::before,
#Menu.abyss-menu-art .MenuButton .Icon::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  display: block !important;
  background: rgba(255, 230, 145, .95) !important;
  box-shadow: 0 0 4px rgba(255, 220, 110, .74) !important;
  transform: translate(-50%, -50%) rotate(-45deg) !important;
}

#Menu.abyss-menu-art .MenuButton .Icon::before {
  width: 12px !important;
  height: 2px !important;
}

#Menu.abyss-menu-art .MenuButton .Icon::after {
  width: 2px !important;
  height: 12px !important;
}

#Menu.abyss-menu-art .MenuButton:hover,
#Menu.abyss-menu-art .MenuButton:focus-visible {
  background:
    radial-gradient(circle at 18% 50%, rgba(56, 210, 255, .31), transparent 29%),
    radial-gradient(circle at 82% 50%, rgba(56, 210, 255, .30), transparent 29%),
    linear-gradient(180deg, rgba(17, 87, 128, .99), rgba(5, 35, 64, .99) 48%, rgba(2, 13, 27, .99)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(60, 25, 4, .86),
    inset 0 2px 0 rgba(255, 232, 157, .44),
    inset 0 -2px 0 rgba(45, 21, 4, .86),
    inset 0 0 22px rgba(0, 166, 255, .22),
    0 0 0 1px rgba(48, 18, 3, .88),
    0 8px 13px rgba(0, 0, 0, .58),
    0 0 16px rgba(0, 166, 255, .32),
    0 0 10px rgba(242, 201, 109, .26) !important;
  transform: translateY(-1px) !important;
}

#Menu.abyss-menu-art #community .MenuButton .Icon {
  animation: abyssCommunityGemSpin 2.2s linear infinite !important;
}

#Menu.abyss-menu-art #community .MenuButton {
  animation: abyssCommunityPulse 3.4s ease-in-out infinite !important;
}

@keyframes abyssCommunityGemSpin {
  from { transform: rotate(45deg); }
  to { transform: rotate(405deg); }
}

@keyframes abyssCommunityPulse {
  0%, 100% {
    filter:
      drop-shadow(0 0 4px rgba(210, 154, 61, .28))
      drop-shadow(0 0 0 rgba(27, 188, 255, 0));
  }
  50% {
    filter:
      drop-shadow(0 0 5px rgba(210, 154, 61, .42))
      drop-shadow(0 0 9px rgba(27, 188, 255, .42));
  }
}

#Menu.abyss-menu-art .Submenu {
  display: grid !important;
  gap: 5px !important;
  width: 276px !important;
  margin: 0 auto !important;
  padding: 0 0 2px !important;
  background: transparent !important;
}

#Menu.abyss-menu-art .menuitem.is-collapsed .Submenu {
  display: none !important;
}

#Menu.abyss-menu-art .Submenu a {
  position: relative !important;
  display: block !important;
  width: 276px !important;
  height: 28px !important;
  min-height: 28px !important;
  border: 1px solid rgba(210, 154, 61, .72) !important;
  border-radius: 4px !important;
  color: #ffe9ad !important;
  text-decoration: none !important;
  background:
    linear-gradient(90deg, rgba(210, 154, 61, .22), transparent 13%, transparent 87%, rgba(210, 154, 61, .22)),
    linear-gradient(180deg, rgba(7, 38, 62, .98), rgba(3, 16, 29, .99)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(16, 7, 1, .72),
    inset 0 1px 0 rgba(255, 232, 157, .14),
    inset 0 -1px 0 rgba(0, 0, 0, .68),
    0 3px 6px rgba(0, 0, 0, .36) !important;
  overflow: hidden !important;
}

#Menu.abyss-menu-art .Submenu a::before {
  content: "" !important;
  position: absolute !important;
  inset: 5px 9px !important;
  opacity: 1 !important;
  background:
    linear-gradient(90deg, transparent, rgba(27, 188, 255, .14), transparent),
    linear-gradient(180deg, rgba(12, 65, 95, .74), rgba(2, 12, 22, .42)) !important;
  border: 1px solid rgba(242, 201, 109, .16) !important;
}

#Menu.abyss-menu-art .Submenuitem,
#Menu.abyss-menu-art .SubmenuitemLabel {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  line-height: 28px !important;
  background: transparent !important;
}

#Menu.abyss-menu-art .SubmenuitemLabel {
  position: relative !important;
  z-index: 3 !important;
  padding: 0 10px 0 31px !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  text-align: left !important;
  text-transform: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  text-shadow:
    0 1px 0 rgba(0, 0, 0, .96),
    0 0 5px rgba(255, 211, 91, .26) !important;
}

#Menu.abyss-menu-art .SubmenuitemLabel::before {
  left: 12px !important;
  top: 9px !important;
  width: 8px !important;
  height: 8px !important;
  border: 1px solid rgba(242, 201, 109, .88) !important;
  background:
    radial-gradient(circle, rgba(94, 225, 255, .98), rgba(4, 75, 126, .98) 58%, rgba(2, 16, 31, .98)) !important;
  box-shadow:
    0 0 0 1px rgba(16, 7, 1, .88),
    0 0 5px rgba(27, 188, 255, .68) !important;
  transform: rotate(45deg) !important;
}

#Menu.abyss-menu-art .Submenu a:hover,
#Menu.abyss-menu-art .Submenu a:focus-visible {
  border-color: rgba(242, 201, 109, .92) !important;
  background:
    linear-gradient(90deg, rgba(242, 201, 109, .28), transparent 13%, transparent 87%, rgba(242, 201, 109, .28)),
    linear-gradient(180deg, rgba(11, 57, 88, .99), rgba(4, 23, 42, .99)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 232, 157, .16),
    inset 0 0 13px rgba(27, 188, 255, .24),
    0 0 8px rgba(27, 188, 255, .26),
    0 3px 7px rgba(0, 0, 0, .42) !important;
}

#Menu.abyss-menu-art .Submenuitem.is-active {
  background:
    linear-gradient(90deg, rgba(111, 68, 18, .34), rgba(21, 92, 130, .62), rgba(111, 68, 18, .34)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(242, 201, 109, .72),
    inset 3px 0 0 rgba(242, 201, 109, .90),
    inset 0 0 13px rgba(27, 188, 255, .30) !important;
}

/* Abyssal image menu pass: use Midjourney border art instead of CSS-drawn frames. */
#Menu.abyss-menu-art {
  width: 332px !important;
  max-width: 332px !important;
}

#Menu.abyss-menu-art .menuitem,
#Menu.abyss-menu-art #news,
#Menu.abyss-menu-art #account,
#Menu.abyss-menu-art #community,
#Menu.abyss-menu-art #library,
#Menu.abyss-menu-art #shops {
  width: 332px !important;
  margin: 0 auto 2px !important;
  padding: 0 !important;
  background: transparent !important;
}

#Menu.abyss-menu-art .MenuButton {
  width: 332px !important;
  height: 76px !important;
  min-height: 76px !important;
  margin: 0 0 -2px !important;
  padding: 0 63px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: url("images/abyssal/menu-sections/imagegen-menu-button-main.png?v=20260530-imagegen-menu-v1") center center / 100% 100% no-repeat !important;
  box-shadow: none !important;
  filter:
    drop-shadow(0 7px 8px rgba(0, 0, 0, .55))
    drop-shadow(0 0 4px rgba(0, 166, 255, .18)) !important;
  transform: none !important;
  overflow: visible !important;
}

#Menu.abyss-menu-art .MenuButton::before {
  content: none !important;
  display: none !important;
}

#Menu.abyss-menu-art .MenuButton::after {
  content: attr(data-title) !important;
  position: absolute !important;
  inset: 0 63px !important;
  z-index: 8 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  color: #ffe38d !important;
  -webkit-text-fill-color: #ffe38d !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  text-shadow:
    0 2px 0 rgba(35, 9, 0, .98),
    0 0 5px rgba(255, 211, 91, .62),
    0 0 2px rgba(0, 0, 0, .95) !important;
}

#Menu.abyss-menu-art .MenuButton > div {
  display: block !important;
}

#Menu.abyss-menu-art .MenuButton .Button,
#Menu.abyss-menu-art .MenuButton .Extend,
#Menu.abyss-menu-art .MenuButton .Lights,
#Menu.abyss-menu-art .MenuButton .Label {
  display: none !important;
}

#Menu.abyss-menu-art .MenuButton .Icon {
  display: none !important;
  position: absolute !important;
  right: 22px !important;
  top: 18px !important;
  z-index: 6 !important;
  width: 22px !important;
  height: 22px !important;
  border: 1px solid rgba(242, 201, 109, .92) !important;
  background:
    radial-gradient(circle at 50% 50%, rgba(255, 244, 174, .95) 0 8%, rgba(41, 197, 255, .98) 9% 34%, rgba(2, 54, 112, .98) 35% 58%, rgba(1, 12, 26, .98) 59% 100%) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 244, 203, .22),
    0 0 6px rgba(27, 188, 255, .72),
    0 0 4px rgba(242, 201, 109, .46) !important;
  transform: rotate(45deg) !important;
}

#Menu.abyss-menu-art .MenuButton .Icon::before,
#Menu.abyss-menu-art .MenuButton .Icon::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  display: block !important;
  background: rgba(255, 230, 145, .96) !important;
  box-shadow: 0 0 3px rgba(255, 220, 110, .76) !important;
  transform: translate(-50%, -50%) rotate(-45deg) !important;
}

#Menu.abyss-menu-art .MenuButton .Icon::before {
  width: 10px !important;
  height: 2px !important;
}

#Menu.abyss-menu-art .MenuButton .Icon::after {
  width: 2px !important;
  height: 10px !important;
}

#Menu.abyss-menu-art .MenuButton:hover,
#Menu.abyss-menu-art .MenuButton:focus-visible {
  background: url("images/abyssal/menu-sections/imagegen-menu-button-main.png?v=20260530-imagegen-menu-v1") center center / 102% 102% no-repeat !important;
  filter:
    drop-shadow(0 8px 9px rgba(0, 0, 0, .58))
    drop-shadow(0 0 7px rgba(0, 166, 255, .38))
    drop-shadow(0 0 5px rgba(242, 201, 109, .26)) !important;
  transform: translateY(-1px) !important;
}

#Menu.abyss-menu-art .MenuButton:hover::after,
#Menu.abyss-menu-art .MenuButton:focus-visible::after,
#Menu.abyss-menu-art .MenuButton:active::after {
  content: attr(data-title) !important;
  display: flex !important;
  color: #ffe38d !important;
  -webkit-text-fill-color: #ffe38d !important;
  opacity: 1 !important;
  visibility: visible !important;
}

#Menu.abyss-menu-art #community .MenuButton {
  transform-origin: 50% 50% !important;
  animation: abyssCommunityButtonOnce 1.35s ease-in-out 10s 1 both !important;
}

#Menu.abyss-menu-art #community .MenuButton .Icon {
  display: none !important;
  animation: none !important;
}

@keyframes abyssCommunityGemSpinOnce {
  0% {
    transform: rotate(45deg) scale(1);
  }
  35% {
    transform: rotate(225deg) scale(1.16);
  }
  70% {
    transform: rotate(405deg) scale(1.08);
  }
  100% {
    transform: rotate(405deg) scale(1);
  }
}

@keyframes abyssCommunityButtonOnce {
  0%, 100% {
    transform: perspective(420px) rotateY(0deg) scale(1);
    filter:
      drop-shadow(0 7px 8px rgba(0, 0, 0, .55))
      drop-shadow(0 0 4px rgba(0, 166, 255, .18));
  }
  45% {
    transform: perspective(420px) rotateY(180deg) scale(1.03);
    filter:
      drop-shadow(0 8px 9px rgba(0, 0, 0, .58))
      drop-shadow(0 0 12px rgba(0, 166, 255, .64))
      drop-shadow(0 0 8px rgba(242, 201, 109, .38));
  }
}

#Menu.abyss-menu-art .Submenu {
  width: 286px !important;
  margin: 0 auto 6px !important;
  padding: 0 !important;
  gap: 2px !important;
}

#Menu.abyss-menu-art .Submenu a {
  width: 286px !important;
  height: 34px !important;
  min-height: 34px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: url("images/abyssal/menu-sections/imagegen-menu-button-submenu.png?v=20260530-imagegen-menu-v1") center center / 100% 100% no-repeat !important;
  box-shadow: none !important;
  filter: drop-shadow(0 3px 4px rgba(0, 0, 0, .38)) !important;
}

#Menu.abyss-menu-art .Submenu a::before {
  content: none !important;
  display: none !important;
}

#Menu.abyss-menu-art .Submenuitem,
#Menu.abyss-menu-art .SubmenuitemLabel {
  line-height: 34px !important;
}

#Menu.abyss-menu-art .SubmenuitemLabel {
  padding: 0 42px !important;
  color: #ffe9ad !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  text-align: center !important;
  text-shadow:
    0 1px 0 rgba(0, 0, 0, .96),
    0 0 4px rgba(255, 211, 91, .36) !important;
}

#Menu.abyss-menu-art .SubmenuitemLabel::before {
  left: 22px !important;
  top: 13px !important;
  width: 7px !important;
  height: 7px !important;
}

#Menu.abyss-menu-art .Submenu a:hover,
#Menu.abyss-menu-art .Submenu a:focus-visible {
  background: url("images/abyssal/menu-sections/imagegen-menu-button-submenu.png?v=20260530-imagegen-menu-v1") center center / 102% 104% no-repeat !important;
  filter:
    drop-shadow(0 4px 5px rgba(0, 0, 0, .42))
    drop-shadow(0 0 5px rgba(0, 166, 255, .30)) !important;
}

/* Abyssal submenu drawer v3 sliced: stretch only the side rails, keep bottom details intact. */
#Menu.abyss-menu-art .MenuButton {
  position: relative !important;
  z-index: 6 !important;
}

#Menu.abyss-menu-art .Submenu {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  box-sizing: border-box !important;
  gap: 3px !important;
  z-index: 3 !important;
  width: 300px !important;
  margin: -22px auto 10px !important;
  padding: 40px 40px 40px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background:
    url("images/abyssal/menu-sections/imagegen-submenu-drawer-v3-top.png?v=20260530-submenu-sliced-v1") top center / 100% 45px no-repeat,
    url("images/abyssal/menu-sections/imagegen-submenu-drawer-v3-bottom.png?v=20260530-submenu-sliced-v1") bottom center / 100% 50px no-repeat,
    url("images/abyssal/menu-sections/imagegen-submenu-drawer-v3-middle.png?v=20260530-submenu-sliced-v5") center 42px / 100% calc(130% - 130px) no-repeat !important;
  box-shadow: none !important;
  filter:
    drop-shadow(0 6px 7px rgba(0, 0, 0, .52))
    drop-shadow(0 0 4px rgba(0, 166, 255, .18)) !important;
  isolation: isolate !important;
  overflow: visible !important;
}

#Menu.abyss-menu-art #community .Submenu {
  background:
    url("images/abyssal/menu-sections/imagegen-submenu-drawer-v3-top.png?v=20260530-submenu-sliced-v1") top center / 100% 45px no-repeat,
    url("images/abyssal/menu-sections/imagegen-submenu-drawer-v3-bottom.png?v=20260530-submenu-sliced-v1") bottom center / 100% 50px no-repeat,
    url("images/abyssal/menu-sections/imagegen-submenu-drawer-v3-middle.png?v=20260530-submenu-community-v1") center 42px / 100% calc(100% - 90px) no-repeat !important;
}

#Menu.abyss-menu-art .Submenu::before {
  content: none !important;
  display: none !important;
}

#Menu.abyss-menu-art .Submenu::after {
  content: none !important;
  display: none !important;
}

#Menu.abyss-menu-art .menuitem.is-collapsed .Submenu {
  display: none !important;
}

#Menu.abyss-menu-art .Submenu a {
  position: relative !important;
  z-index: 2 !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: 21px !important;
  min-height: 19px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(196, 128, 37, .62) !important;
  border-radius: 2px !important;
  color: #ffe9ad !important;
  text-decoration: none !important;
  background:
    linear-gradient(90deg, rgba(196, 128, 37, .18), rgba(8, 39, 66, .18) 18%, rgba(4, 19, 35, .20) 50%, rgba(8, 39, 66, .18) 82%, rgba(196, 128, 37, .18)),
    linear-gradient(180deg, rgba(8, 42, 70, .58), rgba(3, 18, 34, .74)) !important;
  box-shadow:
    0 2px 3px rgba(0, 0, 0, .38) !important;
  filter: none !important;
  overflow: hidden !important;
  transition:
    border-color .16s ease,
    box-shadow .16s ease,
    filter .16s ease,
    transform .16s ease !important;
}

#Menu.abyss-menu-art .Submenu a::before {
  content: none !important;
  position: absolute !important;
  inset: 3px 7px !important;
  display: block !important;
  border: 0 !important;
  border-radius: 2px !important;
  background:
    linear-gradient(90deg, transparent, rgba(56, 210, 255, .15), transparent),
    linear-gradient(180deg, rgba(255, 255, 255, .08), transparent 52%, rgba(0, 0, 0, .18)) !important;
  opacity: .88 !important;
  pointer-events: none !important;
}

#Menu.abyss-menu-art .Submenu a::after {
  content: none !important;
  position: absolute !important;
  left: 9px !important;
  right: 9px !important;
  top: 4px !important;
  height: 1px !important;
  display: block !important;
  background: linear-gradient(90deg, transparent, rgba(255, 232, 157, .52), transparent) !important;
  opacity: .56 !important;
  pointer-events: none !important;
}

#Menu.abyss-menu-art .Submenuitem,
#Menu.abyss-menu-art .SubmenuitemLabel {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  line-height: 19px !important;
  background: transparent !important;
}

#Menu.abyss-menu-art .SubmenuitemLabel {
  position: relative !important;
  z-index: 3 !important;
  padding: 0 15px 0 29px !important;
  color: #ffe9ad !important;
  -webkit-text-fill-color: #ffe9ad !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  text-transform: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  text-shadow:
    0 1px 0 rgba(0, 0, 0, .98),
    0 0 4px rgba(255, 211, 91, .36),
    0 0 7px rgba(0, 166, 255, .16) !important;
}

#Menu.abyss-menu-art .SubmenuitemLabel::before {
  content: "" !important;
  position: absolute !important;
  left: 12px !important;
  top: 50% !important;
  display: block !important;
  width: 6px !important;
  height: 6px !important;
  border: 1px solid rgba(196, 128, 37, .92) !important;
  background:
    radial-gradient(circle at 42% 38%, rgba(115, 231, 255, .98), rgba(1, 88, 151, .98) 56%, rgba(1, 17, 35, .98)) !important;
  box-shadow:
    0 0 0 1px rgba(19, 7, 0, .82),
    0 0 5px rgba(27, 188, 255, .56) !important;
  transform: translateY(-50%) rotate(45deg) !important;
}

#Menu.abyss-menu-art .Submenu a:hover,
#Menu.abyss-menu-art .Submenu a:focus-visible,
#Menu.abyss-menu-art .Submenu a:has(.Submenuitem.is-active) {
  border-color: rgba(255, 222, 132, .96) !important;
  background:
    linear-gradient(90deg, rgba(255, 206, 91, .28), rgba(14, 71, 111, .28) 18%, rgba(5, 32, 58, .28) 50%, rgba(14, 71, 111, .28) 82%, rgba(255, 206, 91, .28)),
    linear-gradient(180deg, rgba(12, 64, 101, .72), rgba(4, 25, 48, .82)) !important;
  box-shadow:
    0 0 7px rgba(27, 188, 255, .28),
    0 2px 4px rgba(0, 0, 0, .44) !important;
  filter: drop-shadow(0 0 3px rgba(255, 206, 91, .22)) !important;
  transform: translateY(-1px) !important;
}

#Menu.abyss-menu-art .Submenu a:hover .SubmenuitemLabel,
#Menu.abyss-menu-art .Submenu a:focus-visible .SubmenuitemLabel,
#Menu.abyss-menu-art .Submenuitem.is-active .SubmenuitemLabel {
  color: #fff4c6 !important;
  -webkit-text-fill-color: #fff4c6 !important;
  text-shadow:
    0 1px 0 rgba(0, 0, 0, .98),
    0 0 6px rgba(255, 211, 91, .56),
    0 0 8px rgba(27, 188, 255, .34) !important;
}

#Menu.abyss-menu-art .Submenuitem.is-active {
  background:
    linear-gradient(90deg, rgba(255, 206, 91, .16), rgba(27, 188, 255, .22), rgba(255, 206, 91, .16)) !important;
  box-shadow:
    inset 3px 0 0 rgba(255, 220, 109, .88),
    inset 0 0 12px rgba(27, 188, 255, .22) !important;
}

/* Keep main menu hover on the artwork only; remove inherited rectangular hover plate. */
#Menu.abyss-menu-art .MenuButton:hover,
#Menu.abyss-menu-art .MenuButton:focus,
#Menu.abyss-menu-art .MenuButton:focus-visible {
  background-color: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
}

#Menu.abyss-menu-art .MenuButton:hover > div,
#Menu.abyss-menu-art .MenuButton:focus > div,
#Menu.abyss-menu-art .MenuButton:focus-visible > div {
  background: transparent !important;
  box-shadow: none !important;
}

#roulette.abyss-roulette-page .BoxContent {
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 231, 166, .28), transparent 38%),
    linear-gradient(180deg, rgba(245, 232, 197, .98), rgba(223, 198, 151, .98)) !important;
  border: 1px solid rgba(203, 143, 42, .72) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 247, 211, .7),
    inset 0 0 24px rgba(108, 15, 12, .12),
    0 0 18px rgba(0, 0, 0, .38) !important;
  color: #4a250e !important;
}

#roulette.abyss-roulette-page :is(div, span, p, strong, h2, h3) {
  color: inherit !important;
}

#roulette .abyss-roulette-simulator,
#roulette .abyss-roulette-rewards {
  padding: 14px !important;
  border: 1px solid rgba(199, 132, 31, .72) !important;
  background:
    linear-gradient(90deg, rgba(119, 15, 14, .12), transparent 18%, transparent 82%, rgba(119, 15, 14, .12)),
    linear-gradient(180deg, rgba(255, 245, 217, .96), rgba(228, 207, 164, .98)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 235, .58),
    inset 0 0 20px rgba(108, 15, 12, .1) !important;
}

#roulette .abyss-roulette-rewards {
  margin-top: 14px !important;
}

#roulette .abyss-roulette-header,
#roulette .abyss-roulette-section-title {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 8px 12px !important;
  border: 1px solid rgba(223, 160, 50, .86) !important;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
}

#roulette .abyss-roulette-kicker,
#roulette .abyss-roulette-source,
#roulette .abyss-roulette-section-title span {
  font: 700 11px Verdana, Arial, sans-serif !important;
  color: #ffe7a4 !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 0 #000 !important;
}

#roulette .abyss-roulette-kicker {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

#roulette .abyss-roulette-header h2,
#roulette .abyss-roulette-section-title h3 {
  margin: 0 !important;
  font: 900 18px Georgia, "Times New Roman", serif !important;
  color: #fff1bd !important;
  text-transform: uppercase !important;
  letter-spacing: 0 !important;
  text-shadow:
    0 1px 0 #000,
    0 0 8px rgba(219, 159, 55, .48) !important;
}

#roulette .abyss-roulette-note {
  margin: 12px 0 !important;
  padding: 10px 12px !important;
  border-left: 3px solid rgba(231, 169, 55, .84) !important;
  background: rgba(0, 0, 0, .25) !important;
  color: #ead49e !important;
  font: 700 12px Verdana, Arial, sans-serif !important;
  line-height: 1.45 !important;
}

#roulette .abyss-roulette-stage {
  display: grid !important;
  grid-template-columns: 108px minmax(0, 1fr) !important;
  gap: 14px !important;
  align-items: stretch !important;
  margin-top: 12px !important;
}

#roulette .abyss-roulette-lever {
  position: relative !important;
  --lever-handle-height: 78px;
  --lever-handle-width: 11px;
  --lever-pivot-bottom: 30px;
  --lever-pull-angle: 29deg;
  --lever-x: 50%;
  min-height: 142px !important;
  border: 1px solid rgba(230, 168, 58, .9) !important;
  overflow: hidden !important;
  background:
    linear-gradient(90deg, rgba(255, 226, 143, .22), transparent 13%, transparent 87%, rgba(255, 226, 143, .18)),
    radial-gradient(circle at 50% 76%, rgba(0, 198, 255, .36), transparent 28%),
    radial-gradient(circle at 50% 16%, rgba(255, 218, 112, .18), transparent 26%),
    linear-gradient(180deg, #123b4d 0%, #08273a 45%, #031522 100%) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 236, 166, .26),
    inset 0 0 18px rgba(0, 0, 0, .72),
    inset 0 12px 18px rgba(255, 255, 218, .05),
    0 0 12px rgba(0, 176, 255, .16) !important;
  cursor: pointer !important;
}

#roulette .abyss-roulette-lever::before {
  content: "" !important;
  position: absolute !important;
  left: var(--lever-x) !important;
  bottom: 18px !important;
  z-index: 1 !important;
  width: 58px !important;
  height: 44px !important;
  border: 1px solid rgba(239, 185, 70, .92) !important;
  border-radius: 18px 18px 8px 8px !important;
  background:
    radial-gradient(circle at 50% 22%, rgba(0, 219, 255, .5), transparent 36%),
    linear-gradient(90deg, rgba(255, 228, 132, .28), transparent 14%, transparent 86%, rgba(255, 228, 132, .22)),
    linear-gradient(180deg, #0e5068 0%, #052237 62%, #020b16 100%) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 241, 161, .18),
    inset 0 0 16px rgba(0, 0, 0, .7),
    0 4px 8px rgba(0, 0, 0, .52),
    0 0 12px rgba(0, 200, 255, .18) !important;
  transform: translateX(-50%) !important;
}

#roulette .abyss-roulette-lever::after {
  content: "" !important;
  position: absolute !important;
  left: var(--lever-x) !important;
  bottom: calc(var(--lever-pivot-bottom) - 13px) !important;
  z-index: 4 !important;
  width: 35px !important;
  height: 35px !important;
  border: 1px solid rgba(255, 207, 87, .94) !important;
  border-radius: 50% !important;
  background:
    radial-gradient(circle at 35% 28%, #fff0a9 0 9%, #d8942d 28%, #6f3309 54%, #170903 100%) !important;
  box-shadow:
    inset -5px -6px 8px rgba(21, 7, 0, .58),
    inset 2px 2px 5px rgba(255, 236, 165, .56),
    0 0 0 4px rgba(0, 0, 0, .18),
    0 4px 7px rgba(0, 0, 0, .58) !important;
  transform: translateX(-50%) !important;
}

#roulette .abyss-roulette-lever:disabled {
  cursor: wait !important;
  filter: brightness(.88) !important;
}

#roulette .abyss-roulette-lever__handle {
  position: absolute !important;
  left: var(--lever-x) !important;
  bottom: var(--lever-pivot-bottom) !important;
  z-index: 3 !important;
  display: block !important;
  width: var(--lever-handle-width) !important;
  height: var(--lever-handle-height) !important;
  border: 1px solid rgba(72, 31, 5, .66) !important;
  border-radius: 999px !important;
  background:
    linear-gradient(90deg, #2d0f02, #a85b13 24%, #fff1a8 48%, #b66a18 68%, #361302) !important;
  box-shadow:
    inset 1px 0 0 rgba(255, 239, 161, .5),
    inset -2px 0 4px rgba(34, 10, 0, .6),
    0 4px 7px rgba(0, 0, 0, .54),
    0 0 12px rgba(255, 197, 69, .16) !important;
  transform: translateX(-50%) rotate(0deg) !important;
  transform-origin: 50% calc(100% - 2px) !important;
  transition: transform .42s cubic-bezier(.18, .88, .16, 1.02), filter .28s ease !important;
}

#roulette .abyss-roulette-lever__handle::before {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: -21px !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(96, 45, 7, .72) !important;
  background:
    radial-gradient(circle at 32% 26%, #fff7c9 0 13%, #e9aa40 36%, #a45a12 62%, #4c1b04 100%) !important;
  box-shadow:
    inset -4px -5px 8px rgba(54, 19, 0, .48),
    inset 2px 2px 5px rgba(255, 246, 190, .56),
    0 0 11px rgba(228, 167, 56, .6),
    0 2px 4px rgba(0, 0, 0, .6) !important;
  transform: translateX(-50%) !important;
}

#roulette .abyss-roulette-lever__base {
  position: absolute !important;
  left: var(--lever-x) !important;
  bottom: 14px !important;
  z-index: 2 !important;
  display: block !important;
  width: 64px !important;
  height: 22px !important;
  border: 1px solid rgba(255, 203, 82, .88) !important;
  border-radius: 4px !important;
  background:
    linear-gradient(90deg, rgba(255, 226, 128, .38), transparent 14%, transparent 86%, rgba(255, 226, 128, .28)),
    linear-gradient(180deg, #087faa, #031a2f) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 240, 167, .16),
    inset 0 0 11px rgba(0, 192, 255, .35),
    0 4px 7px rgba(0, 0, 0, .58) !important;
  transform: translateX(-50%) !important;
}

#roulette .abyss-roulette-simulator.is-spinning .abyss-roulette-lever__handle {
  filter: brightness(1.08) saturate(1.08) !important;
  transform: translateX(-50%) rotate(var(--lever-pull-angle)) !important;
}

#roulette .abyss-roulette-track {
  position: relative !important;
  min-height: 142px !important;
  overflow: hidden !important;
  border: 1px solid rgba(215, 146, 40, .82) !important;
  background:
    repeating-linear-gradient(90deg, rgba(118, 74, 24, .2) 0 1px, transparent 1px 72px),
    linear-gradient(180deg, rgba(236, 216, 171, .96), rgba(183, 145, 86, .96)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 244, 194, .42),
    inset 0 0 24px rgba(80, 42, 10, .36) !important;
}

#roulette .abyss-roulette-pointer {
  position: absolute !important;
  z-index: 3 !important;
  left: 50% !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 78px !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  padding-top: 7px !important;
  border-left: 1px solid rgba(255, 231, 146, .76) !important;
  border-right: 1px solid rgba(255, 231, 146, .76) !important;
  background: linear-gradient(180deg, rgba(255, 202, 78, .2), transparent 30%, rgba(255, 202, 78, .16)) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font: 800 10px Verdana, Arial, sans-serif !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 0 #000, 0 0 8px rgba(255, 210, 86, .5) !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
}

#roulette .abyss-roulette-strip {
  display: flex !important;
  gap: 10px !important;
  padding: 42px 16px 16px !important;
  will-change: transform !important;
}

#roulette .abyss-roulette-tile {
  flex: 0 0 76px !important;
  width: 76px !important;
  text-align: center !important;
}

#roulette .abyss-roulette-tile__sq,
#roulette .abyss-roulette-card__image {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 58px !important;
  height: 58px !important;
  margin: 0 auto 6px !important;
  border: 1px solid rgba(192, 126, 30, .82) !important;
  background:
    radial-gradient(circle at 50% 34%, rgba(7, 97, 151, .78), rgba(1, 14, 29, .94) 62%),
    linear-gradient(180deg, rgba(255, 223, 122, .12), transparent) !important;
  box-shadow:
    inset 0 0 0 1px rgba(0, 194, 255, .24),
    inset 0 0 16px rgba(0, 0, 0, .66),
    0 0 8px rgba(0, 0, 0, .6) !important;
}

#roulette .abyss-roulette-tile__sq img,
#roulette .abyss-roulette-card__image img {
  max-width: 44px !important;
  max-height: 44px !important;
  image-rendering: auto !important;
}

#roulette .abyss-roulette-tile span {
  display: block !important;
  height: 28px !important;
  overflow: hidden !important;
  color: #4b250d !important;
  font: 700 10px Verdana, Arial, sans-serif !important;
  line-height: 1.2 !important;
  text-shadow: 0 1px 0 rgba(255, 242, 196, .75) !important;
}

#roulette .abyss-roulette-tile__fallback,
#roulette .abyss-roulette-card__image span {
  color: #fff0b0 !important;
  font: 900 11px Verdana, Arial, sans-serif !important;
}

#roulette .abyss-roulette-tile__count {
  position: absolute !important;
  right: 3px !important;
  bottom: 2px !important;
  height: auto !important;
  color: #fff3bd !important;
  font-size: 9px !important;
}

#roulette .abyss-roulette-tile.is-winner .abyss-roulette-tile__sq {
  border-color: rgba(255, 231, 139, .96) !important;
  box-shadow:
    inset 0 0 0 1px rgba(0, 210, 255, .48),
    inset 0 0 18px rgba(255, 202, 72, .2),
    0 0 18px rgba(255, 205, 83, .55) !important;
}

#roulette .abyss-roulette-result,
#roulette .abyss-roulette-empty {
  margin-top: 12px !important;
  padding: 10px 12px !important;
  border: 1px solid rgba(218, 150, 42, .7) !important;
  background: linear-gradient(180deg, rgba(255, 241, 204, .82), rgba(219, 191, 139, .82)) !important;
  color: #4d260d !important;
  font: 700 12px Verdana, Arial, sans-serif !important;
  text-align: center !important;
}

#roulette .abyss-roulette-result strong {
  color: #168f22 !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 0 rgba(255, 255, 220, .75), 0 0 6px rgba(38, 190, 55, .34) !important;
}

#roulette .abyss-roulette-empty span {
  display: block !important;
  margin-top: 5px !important;
  color: #c99645 !important;
  font-size: 10px !important;
}

#roulette .abyss-roulette-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(238px, 1fr)) !important;
  gap: 10px !important;
  margin-top: 12px !important;
}

#roulette .abyss-roulette-card {
  display: grid !important;
  grid-template-columns: 64px minmax(0, 1fr) !important;
  gap: 8px !important;
  align-items: center !important;
  min-height: 76px !important;
  padding: 8px !important;
  border: 1px solid rgba(144, 89, 23, .78) !important;
  background:
    linear-gradient(90deg, rgba(123, 17, 16, .1), rgba(255, 232, 176, .16)),
    linear-gradient(180deg, rgba(255, 241, 207, .94), rgba(222, 198, 154, .94)) !important;
  box-shadow:
    inset 0 0 10px rgba(255, 255, 230, .38),
    0 1px 0 rgba(255, 255, 236, .72) !important;
}

#roulette .abyss-roulette-card__image {
  width: 54px !important;
  height: 54px !important;
  margin: 0 !important;
}

#roulette .abyss-roulette-card__body {
  min-width: 0 !important;
}

#roulette .abyss-roulette-card__body strong {
  display: block !important;
  color: #5a2a0f !important;
  font: 800 12px Verdana, Arial, sans-serif !important;
  line-height: 1.2 !important;
  text-shadow: 0 1px 0 rgba(255, 245, 210, .8) !important;
  text-transform: capitalize !important;
  white-space: normal !important;
  overflow: visible !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: none !important;
}

#roulette .abyss-roulette-card__body span {
  display: block !important;
  margin-top: 4px !important;
  color: #8f5a19 !important;
  font: 700 10px Verdana, Arial, sans-serif !important;
}

#roulette.abyss-slotmachine-page .abyss-roulette-grid {
  grid-template-columns: repeat(auto-fill, minmax(292px, 1fr)) !important;
}

#roulette .abyss-slotmachine-stage {
  grid-template-columns: 150px minmax(0, 1fr) !important;
  align-items: stretch !important;
}

#roulette.abyss-slotmachine-page .abyss-roulette-lever {
  --lever-handle-height: 150px;
  --lever-handle-width: 18px;
  --lever-pivot-bottom: 74px;
  --lever-pull-angle: 28deg;
  --lever-x: 50%;
  min-height: 276px !important;
}

#roulette.abyss-slotmachine-page .abyss-roulette-lever::before {
  bottom: 44px !important;
  width: 86px !important;
  height: 96px !important;
  border-radius: 34px 34px 10px 10px !important;
  background:
    radial-gradient(circle at 50% 66%, rgba(255, 78, 27, .62), transparent 20%),
    linear-gradient(90deg, rgba(255, 216, 123, .3), transparent 12%, transparent 88%, rgba(255, 216, 123, .22)),
    linear-gradient(180deg, #3c3434 0%, #141014 62%, #060407 100%) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 220, 138, .18),
    inset 0 0 24px rgba(0, 0, 0, .76),
    0 8px 11px rgba(0, 0, 0, .58),
    0 0 14px rgba(255, 88, 28, .18) !important;
}

#roulette.abyss-slotmachine-page .abyss-roulette-lever::after {
  bottom: calc(var(--lever-pivot-bottom) - 25px) !important;
  width: 56px !important;
  height: 56px !important;
  border-color: rgba(255, 196, 70, .94) !important;
  background:
    radial-gradient(circle at 35% 28%, #fff0a9 0 8%, #df9b2e 24%, #68320b 52%, #100604 100%) !important;
  box-shadow:
    inset -8px -8px 12px rgba(21, 7, 0, .62),
    inset 3px 3px 6px rgba(255, 236, 165, .56),
    0 0 0 7px rgba(0, 0, 0, .18),
    0 7px 10px rgba(0, 0, 0, .62) !important;
}

#roulette.abyss-slotmachine-page .abyss-roulette-lever__handle {
  display: block !important;
  transition-duration: .48s !important;
}

#roulette.abyss-slotmachine-page .abyss-roulette-lever__handle::before {
  top: -32px !important;
  width: 58px !important;
  height: 58px !important;
}

#roulette.abyss-slotmachine-page .abyss-roulette-lever__base {
  display: block !important;
  bottom: 32px !important;
  width: 88px !important;
  height: 43px !important;
  border-radius: 7px !important;
  background:
    linear-gradient(90deg, rgba(255, 222, 126, .34), transparent 12%, transparent 88%, rgba(255, 222, 126, .24)),
    linear-gradient(180deg, #4a3331, #120b10) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 230, 154, .16),
    inset 0 0 15px rgba(255, 75, 28, .24),
    0 7px 10px rgba(0, 0, 0, .62) !important;
}

#roulette.abyss-slotmachine-page .abyss-roulette-simulator.is-pulled .abyss-roulette-lever__handle {
  filter: brightness(1.08) saturate(1.1) !important;
  transform: translateX(-50%) rotate(var(--lever-pull-angle)) !important;
}

#roulette.abyss-slotmachine-page .abyss-roulette-simulator.is-pulling .abyss-roulette-lever {
  filter: brightness(1.08) !important;
}

#roulette .abyss-slotmachine-cabinet {
  min-height: 276px !important;
  padding: 14px !important;
  border: 1px solid rgba(168, 103, 28, .92) !important;
  background:
    linear-gradient(180deg, rgba(255, 239, 190, .95), rgba(184, 132, 59, .88)),
    radial-gradient(circle at 50% 38%, rgba(255, 255, 230, .42), transparent 52%) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 251, 219, .45),
    inset 0 0 22px rgba(97, 44, 8, .26),
    0 4px 12px rgba(0, 0, 0, .22) !important;
}

#roulette .abyss-slotmachine-reels {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(3, 76px) !important;
  gap: 10px !important;
  height: 100% !important;
}

#roulette .abyss-slotmachine-reels .abyss-roulette-tile {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 6px 4px !important;
  border: 1px solid rgba(128, 75, 18, .42) !important;
  background:
    linear-gradient(180deg, rgba(255, 245, 210, .46), rgba(160, 107, 42, .22)),
    rgba(107, 56, 17, .08) !important;
}

#roulette .abyss-slotmachine-reels .abyss-roulette-tile.is-slot-line {
  border-color: rgba(126, 21, 16, .58) !important;
  background:
    linear-gradient(180deg, rgba(255, 247, 216, .62), rgba(201, 151, 82, .32)),
    linear-gradient(90deg, rgba(126, 21, 16, .1), transparent 38%, rgba(126, 21, 16, .1)) !important;
}

#roulette .abyss-slotmachine-reels .abyss-roulette-tile.is-winner {
  border-color: rgba(22, 143, 34, .95) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 250, 199, .68),
    0 0 14px rgba(22, 143, 34, .44) !important;
  animation: abyssSlotWinPulse 920ms ease-in-out infinite alternate !important;
}

#roulette .abyss-slotmachine-reels .abyss-roulette-tile.is-winner .abyss-roulette-tile__sq {
  border-color: rgba(255, 231, 139, .96) !important;
  box-shadow:
    inset 0 0 0 1px rgba(0, 210, 255, .52),
    inset 0 0 18px rgba(255, 202, 72, .24),
    0 0 18px rgba(255, 205, 83, .58) !important;
}

@keyframes abyssSlotWinPulse {
  from {
    filter: brightness(1) saturate(1) !important;
  }

  to {
    filter: brightness(1.16) saturate(1.18) !important;
  }
}

#roulette .abyss-slotmachine-reels .abyss-roulette-tile__sq {
  width: 48px !important;
  height: 48px !important;
  margin-bottom: 4px !important;
}

#roulette .abyss-slotmachine-reels .abyss-roulette-tile__sq img {
  max-width: 42px !important;
  max-height: 42px !important;
}

#roulette .abyss-slotmachine-reels .abyss-roulette-tile span {
  height: 22px !important;
  max-width: 100% !important;
  font-size: 9px !important;
}

#roulette .abyss-slotmachine-card {
  grid-template-columns: 64px minmax(0, 1fr) !important;
}

#roulette .abyss-roulette-card__body em {
  display: block !important;
  margin-top: 5px !important;
  color: #6d380f !important;
  font: 700 10px Verdana, Arial, sans-serif !important;
  font-style: normal !important;
  line-height: 1.25 !important;
}

.abyss-roulette-tooltip {
  position: fixed !important;
  z-index: 99999 !important;
  left: auto;
  top: auto;
  display: none !important;
  width: max-content !important;
  max-width: min(560px, calc(100vw - 36px)) !important;
  max-height: min(620px, calc(100vh - 36px)) !important;
  overflow: auto !important;
  padding: 14px 16px !important;
  border: 1px solid rgba(174, 111, 29, .92) !important;
  background:
    linear-gradient(180deg, rgba(255, 245, 215, .98), rgba(225, 199, 151, .98)),
    linear-gradient(90deg, rgba(126, 21, 16, .1), transparent 28%, transparent 72%, rgba(126, 21, 16, .08)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 252, 230, .62),
    inset 0 0 18px rgba(115, 66, 17, .14),
    0 8px 18px rgba(0, 0, 0, .45) !important;
  color: #48210a !important;
  font: 700 11px Verdana, Arial, sans-serif !important;
  line-height: 1.42 !important;
  text-align: left !important;
  pointer-events: none !important;
}

.abyss-roulette-tooltip.is-visible {
  display: block !important;
}

.abyss-roulette-tooltip strong {
  display: block !important;
  margin: -4px -6px 8px !important;
  padding: 5px 8px !important;
  border-bottom: 1px solid rgba(174, 111, 29, .55) !important;
  background: linear-gradient(180deg, rgba(126, 21, 16, .98), rgba(72, 8, 10, .98)) !important;
  color: #fff6d4 !important;
  font: 900 12px Georgia, "Times New Roman", serif !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 0 #000 !important;
}

.abyss-roulette-tooltip__sprites {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: flex-end !important;
  justify-content: center !important;
  gap: 8px !important;
  width: max-content !important;
  max-width: 100% !important;
  margin: 0 auto 10px !important;
}

.abyss-roulette-tooltip__sprite-frame {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 64px !important;
  height: 64px !important;
  margin: 0 !important;
  padding: 4px !important;
  border: 1px solid rgba(174, 111, 29, .72) !important;
  background:
    radial-gradient(circle at 50% 35%, rgba(7, 97, 151, .72), rgba(1, 14, 29, .95) 66%),
    linear-gradient(180deg, rgba(255, 223, 122, .16), transparent) !important;
  box-shadow:
    inset 0 0 0 1px rgba(0, 194, 255, .22),
    inset 0 0 14px rgba(0, 0, 0, .6),
    0 2px 8px rgba(74, 31, 7, .32) !important;
}

.abyss-roulette-tooltip__sprite {
  display: block !important;
  width: auto !important;
  max-width: 56px !important;
  max-height: 56px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  image-rendering: auto !important;
}

.abyss-roulette-tooltip span {
  display: block !important;
  color: #4f260d !important;
}

@media (max-width: 760px) {
  #roulette .abyss-roulette-stage {
    grid-template-columns: 60px minmax(0, 1fr) !important;
  }

  #roulette .abyss-roulette-lever,
  #roulette .abyss-roulette-track {
    min-height: 124px !important;
  }

  #roulette.abyss-slotmachine-page .abyss-roulette-lever,
  #roulette .abyss-slotmachine-cabinet {
    min-height: 236px !important;
  }

  #roulette .abyss-roulette-grid {
    grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)) !important;
  }
}