/* Exact-page compatibility layer for the original Morpheus/NoxusMU artwork. */
.noxus-exact-inner .nx-main {
  width: 100%;
  max-width: none;
  min-height: 720px;
  margin: 0;
  padding: 0;
  background: #05010f;
}

.noxus-exact-inner .nx-footer {
  border-top: 1px solid rgba(155, 67, 224, .28);
  background: #090412;
}

/* Original login panel (loginpanel.png). */
.nx-original-login-page {
  display: grid;
  min-height: calc(100vh - 170px);
  place-items: start center;
  padding: 46px 18px 70px;
  background: radial-gradient(circle at 50% 14%, rgba(90, 29, 146, .18), transparent 42%), #05010f;
}

.nx-original-register,
.nx-original-register .box {
  width: min(577px, 94vw);
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  box-shadow: none;
}

.nxLoginPanel {
  position: relative;
  width: 100%;
  aspect-ratio: 577 / 433;
  font-family: inherit;
  background: url('../images/loginpanel.png') center / 100% 100% no-repeat;
  filter: drop-shadow(0 24px 46px rgba(0, 0, 0, .62));
}

.nxLoginPanel .nxL-fld { position: absolute; padding: 0; }

#register .nxLoginPanel .nxL-fld input {
  width: 100%;
  height: 100%;
  margin: 0 !important;
  padding: 0 16px !important;
  appearance: none;
  border: 0 !important;
  outline: 0 !important;
  background-color: transparent !important;
  box-shadow: none !important;
  color: #fff !important;
  font: 700 clamp(11px, 1.4vw, 15px) 'Open Sans', Arial, sans-serif;
  font-variant: normal;
  letter-spacing: .02em;
  text-transform: none !important;
}

#register .nxLoginPanel .nxL-fld input::placeholder { color: rgba(220, 205, 255, .55); }
#register .nxLoginPanel .nxL-fld input:-webkit-autofill {
  -webkit-text-fill-color: #fff !important;
  -webkit-box-shadow: 0 0 0 1000px #100e16 inset !important;
  caret-color: #fff;
}

.nxLoginPanel .nxL-zone {
  position: absolute;
  display: block;
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  cursor: pointer;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  color: transparent !important;
  text-decoration: none;
}

.nxL-fld[data-k='login'] { left: 26%; top: 36.2%; width: 48.2%; height: 6.5%; }
.nxL-fld[data-k='password'] { left: 25.7%; top: 50.8%; width: 48.5%; height: 7.2%; }
.nxL-zone[data-k='forgot'] { left: 21.2%; top: 62.2%; width: 24%; height: 5%; }
.nxL-zone[data-k='signup'] { left: 21.6%; top: 68.3%; width: 16%; height: 5%; }
.nxL-zone[data-k='signin'] { left: 45%; top: 62.6%; width: 30.4%; height: 10.5%; }
.nxL-zone[data-k='close'] { left: 84.4%; top: 7.3%; width: 6.4%; height: 8.2%; z-index: 8; }

.nx-original-login-error {
  margin: 0 8% 12px;
  padding: 10px 14px;
  border: 1px solid rgba(244, 93, 119, .55);
  background: rgba(94, 14, 42, .86);
  color: #ffdbe2;
  font-size: 13px;
  text-align: center;
}

.nx-original-login-error i { margin-right: 7px; }

/* Original account panel (panel.png). */
.nx-original-account-page {
  min-height: calc(100vh - 170px);
  padding: 38px 18px 80px;
  background: radial-gradient(circle at 50% 8%, rgba(100, 34, 165, .16), transparent 40%), #05010f;
}

.nxAccountPanel {
  position: relative;
  width: min(1200px, 94vw);
  aspect-ratio: 1672 / 941;
  margin: 0 auto;
  font-family: inherit;
  background: url('../images/panel.png') center / 100% 100% no-repeat;
  filter: drop-shadow(0 28px 52px rgba(0, 0, 0, .62));
}

/* The top-left crest is baked into panel.png. Mask only that decorative icon. */
.nxAccountPanel::before {
  position: absolute;
  z-index: 1;
  left: 17.05%;
  top: 3.9%;
  width: 4.15%;
  height: 8.7%;
  content: '';
  pointer-events: none;
  border-radius: 50%;
  background: radial-gradient(ellipse at 48% 50%,
    rgb(14, 10, 32) 0 56%,
    rgb(17, 10, 35) 72%,
    rgba(21, 12, 40, .88) 86%,
    rgba(21, 12, 40, 0) 100%);
}

.nxAccountPanel .nxA-val {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  overflow: hidden;
  padding-right: 2px;
  background: linear-gradient(90deg, rgba(22, 13, 40, 0), rgba(22, 13, 40, .98) 28%);
  color: #fff;
  font: 700 clamp(8px, .85vw, 14px) 'Cinzel', Georgia, serif;
  letter-spacing: .01em;
  text-transform: none;
  white-space: nowrap;
}

.nxAccountPanel .nxA-gold { color: #f6cd78; }
.nxAccountPanel .nxA-top { justify-content: flex-start; background: none; }
.nxAccountPanel .nxA-val[data-k='membership'] { font-size: clamp(7px, .72vw, 12px); }
.nxAccountPanel .nxA-val[data-k='region'] { font-size: clamp(7px, .76vw, 13px); }
.nxAccountPanel .nxA-val[data-k='joindate'] { font-size: clamp(7px, .78vw, 13px); }
.nxAccountPanel .nxA-zone { position: absolute; display: block; cursor: pointer; border: 0; background: transparent; text-decoration: none; }
.nxAccountPanel .nxA-logout { display: contents; }
.nxAccountPanel button.nxA-zone[data-k='logout'] {
  appearance: none !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: transparent !important;
  font-size: 0 !important;
  filter: none !important;
}

.nxA-val[data-k='creditsTop'] { left: 27.1%; top: 5.5%; width: 13%; height: 6.5%; }
.nxA-val[data-k='name'] { left: 34.7%; top: 22%; width: 18.5%; height: 5.6%; }
.nxA-val[data-k='membership'] { left: 34.6%; top: 27%; width: 18.5%; height: 5.6%; }
.nxA-val[data-k='credits'] { left: 34.6%; top: 32.3%; width: 18.5%; height: 5.6%; }
.nxA-val[data-k='joindate'] { left: 34.6%; top: 38.7%; width: 18.5%; height: 5.6%; }
.nxA-val[data-k='region'] { left: 34.6%; top: 45.5%; width: 18.5%; height: 5.6%; }
.nxA-zone[data-k='tabAccount'] { left: 18.4%; top: 12.6%; width: 16.7%; height: 6.1%; }
.nxA-zone[data-k='tabChars'] { left: 36.3%; top: 12.4%; width: 16.4%; height: 7.1%; }
.nxA-zone[data-k='changePass'] { left: 18.7%; top: 57.4%; width: 33.6%; height: 5.9%; }
.nxA-zone[data-k='changeEmail'] { left: 18.7%; top: 64.1%; width: 33.4%; height: 5.7%; }
.nxA-zone[data-k='viewChars'] { left: 18.6%; top: 71.8%; width: 33.7%; height: 5.1%; }
.nxA-zone[data-k='logout'] { left: 35.4%; top: 83.7%; width: 29%; height: 9.5%; }
.nxA-zone[data-k='close'] { left: 80.1%; top: 4.7%; width: 6%; height: 7%; }

.nx-original-character-list {
  width: min(1100px, calc(100% - 36px));
  margin: 38px auto 0;
  padding: 26px;
  border: 1px solid rgba(182, 91, 242, .3);
  background: linear-gradient(180deg, rgba(29, 11, 48, .94), rgba(9, 4, 20, .96));
}

.nx-original-character-list .h2-title { margin-bottom: 22px; }
.nx-original-character-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.nx-original-character-grid > a {
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 3px 12px;
  align-items: center;
  min-height: 82px;
  padding: 12px 15px;
  border: 1px solid rgba(137, 66, 202, .42);
  background: rgba(19, 8, 34, .9);
  color: #bba8ce;
  text-decoration: none;
}

.nx-original-character-grid > a:hover { border-color: #d49a4d; background: rgba(53, 19, 59, .96); }
.nx-original-character-grid img { grid-row: 1 / 4; width: 52px; height: 52px; object-fit: contain; }
.nx-original-character-grid strong { color: #f2ce7b; font: 700 16px 'Cinzel', serif; }
.nx-original-character-grid span { font-size: 12px; }

/* Original profile armory frame. */
.nx-original-profile-page { width: 100%; padding: 20px 0 68px; background: #05010f; }
.nx-armory-original {
  position: relative;
  width: min(1800px, calc(100vw - 36px));
  aspect-ratio: 1800 / 900;
  margin: 0 auto;
  overflow: hidden;
  background: url('../images/noxus/profile-armory-template.png') center / 100% 100% no-repeat;
  color: #f2e5bd;
}

.nx-armory-page-title,
.nx-armory-equip-title,
.nx-armory-player,
.nx-armory-guild,
.nx-armory-slots,
.nx-armory-stage,
.nx-armory-summary { position: absolute; }

.nx-armory-page-title { left: 4.1%; top: 3.5%; margin: 0; color: #f0d083; font: 800 clamp(11px, 1.3vw, 23px) 'Cinzel', serif; letter-spacing: .12em; text-transform: uppercase; }
.nx-armory-page-title i { margin-right: .4em; color: #a94cff; }
.nx-armory-equip-title { left: 47.2%; top: 2.7%; margin: 0; color: #f0d083; font: 800 clamp(14px, 1.8vw, 31px) 'Cinzel', serif; letter-spacing: .18em; text-transform: uppercase; }

.nx-armory-player { left: 3.7%; top: 11%; width: 23.4%; height: 31%; padding: 8.5% 2% 1.5% 12.5%; }
.nx-armory-player > img { position: absolute; left: 8%; top: 22%; width: 31%; height: 43%; object-fit: contain; }
.nx-armory-player h3 { margin: 0 0 1%; color: #d688ff; font: 700 clamp(10px, 1.2vw, 21px) Georgia, serif; }
.nx-armory-player > strong { display: block; margin-bottom: 5%; color: #f1cf73; font-size: clamp(7px, .7vw, 12px); }
.nx-armory-player dl,
.nx-armory-guild dl,
.nx-armory-summary dl { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin: 0; }
.nx-armory-player dt,
.nx-armory-player dd,
.nx-armory-guild dt,
.nx-armory-guild dd,
.nx-armory-summary dt,
.nx-armory-summary dd { margin: 0; padding: 2.3% 0; border-bottom: 1px solid rgba(157, 90, 184, .13); font-size: clamp(6px, .6vw, 11px); }
.nx-armory-player dt,
.nx-armory-guild dt,
.nx-armory-summary dt { color: #c7a964; text-transform: lowercase; }
.nx-armory-player dd,
.nx-armory-guild dd,
.nx-armory-summary dd { color: #fff; text-align: right; }
.nx-armory-player dd.online { color: #5bf0a4; }

.nx-armory-guild { left: 3.7%; top: 43.7%; width: 23.4%; height: 24%; padding: 4.8% 2.1% 1% 4.2%; }
.nx-armory-guild > span { position: absolute; left: 50%; top: 5%; transform: translateX(-50%); color: #f0d083; font: 700 clamp(7px, .72vw, 13px) 'Cinzel', serif; letter-spacing: .13em; text-transform: uppercase; }

.nx-armory-slots { left: 28.4%; top: 11.5%; width: 14.7%; height: 61%; display: grid; grid-template-rows: repeat(8, 1fr); gap: .7%; }
.nx-armory-slots > div { display: flex; align-items: center; gap: 6%; padding: 0 7%; border: 1px solid rgba(224, 173, 84, .2); background: rgba(10, 6, 18, .72); }
.nx-armory-slots i { display: grid; place-items: center; width: 25%; aspect-ratio: 1; background: #27123c; color: #6f2eae; font-size: clamp(7px, .7vw, 13px); }
.nx-armory-slots span { color: #f1cb70; font-size: clamp(6px, .62vw, 11px); }
.nx-armory-slots small { display: block; color: #a78abd; font-size: .8em; }

.nx-armory-stage { left: 43.7%; top: 10.4%; width: 31.3%; height: 68%; text-align: center; }
.nx-armory-stage img { position: absolute; left: 50%; top: 45%; width: 61%; height: 64%; transform: translate(-50%, -50%); object-fit: contain; opacity: .92; }
.nx-armory-stage strong { position: absolute; left: 0; right: 0; bottom: 9%; color: #d98cff; font: 700 clamp(10px, 1.2vw, 22px) Georgia, serif; }
.nx-armory-stage span { position: absolute; left: 0; right: 0; bottom: 5.5%; color: #f1cc70; font-size: clamp(7px, .65vw, 12px); }

.nx-armory-summary { left: 76.1%; top: 11%; width: 20.7%; height: 59%; padding: 7% 2% 2%; }
.nx-armory-summary h3 { margin: 0 0 5%; color: #f0d083; font: 700 clamp(7px, .72vw, 13px) 'Cinzel', serif; letter-spacing: .1em; text-align: center; text-transform: uppercase; }
.nx-armory-summary > strong { display: block; margin: 5% 0 3%; color: #d98cff; font: 700 clamp(9px, 1vw, 18px) Georgia, serif; text-align: center; }
.nx-armory-summary > span { display: block; min-height: 24%; color: #b9a8c9; font-size: clamp(6px, .54vw, 10px); text-align: center; }
.nx-armory-summary h3:nth-of-type(2) { margin-top: 9%; }

.nx-original-trophy-room { width: min(1700px, calc(100vw - 72px)); margin: 24px auto 0; padding: 22px; border-top: 1px solid rgba(205, 145, 61, .48); color: #eadcb7; }
.nx-original-trophy-room > small { color: #b99854; font: 700 11px 'Cinzel', serif; text-transform: uppercase; }
.nx-original-trophy-room h2 { margin: 5px 0 22px; color: #f0d083; font: 700 25px Georgia, serif; }
.nx-original-trophy-room > div { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.nx-original-trophy-room article { position: relative; display: grid; min-height: 190px; place-items: center; padding: 20px 12px; border: 1px solid rgba(151, 75, 210, .42); background: linear-gradient(180deg, rgba(30, 17, 41, .95), rgba(14, 8, 24, .97)); text-align: center; }
.nx-original-trophy-room article b { position: absolute; left: 10px; top: 8px; color: #80708d; font-size: 10px; }
.nx-original-trophy-room article i { color: #a24bff; font-size: 50px; text-shadow: 0 0 18px rgba(161, 76, 255, .55); }
.nx-original-trophy-room article strong { color: #f0d083; font: 700 13px 'Cinzel', serif; }
.nx-original-trophy-room article span { color: #8e7f9d; font-size: 10px; }

/* Original reset-ranking layout and sidebar. */
.mainRankingPage {
  display: grid !important;
  grid-template-columns: 240px minmax(0, 1fr);
  gap: 20px;
  width: min(1540px, calc(100vw - 70px)) !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 18px 0 66px !important;
}

.mainRankingPage .lovableRankSidebar {
  display: block !important;
  width: 240px !important;
  min-width: 240px;
  margin: 0 !important;
  padding: 24px 13px 18px;
  border: 1px solid rgba(151, 76, 212, .5);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(35, 13, 58, .96), rgba(13, 6, 28, .98));
  box-shadow: inset 0 0 30px rgba(82, 22, 125, .16);
}

.lovableRankSidebar-head { padding: 0 8px; }
.lovableRankSidebar-head span { display: block; color: #a98bbc; font: 700 11px 'Cinzel', serif; letter-spacing: .18em; text-transform: uppercase; }
.lovableRankSidebar-head strong { display: block; margin-top: 3px; color: #f3dfac; font: 800 21px 'Cinzel', serif; letter-spacing: .08em; text-transform: uppercase; }
.lovableRankSidebar-line { width: 100%; height: 2px; margin: 17px 0 12px; background: linear-gradient(90deg, #d4a348, #8f42de 34%, transparent); }
.lovableRankSidebar nav { display: grid; gap: 4px; }
.lovableRankSidebar nav a { position: relative; display: flex; align-items: center; min-height: 42px; padding: 6px 28px 6px 8px; border-radius: 8px; color: #d5bfe6; font: 700 11px 'Cinzel', serif; letter-spacing: .04em; text-decoration: none; text-transform: uppercase; }
.lovableRankSidebar nav a:hover,
.lovableRankSidebar nav a.active { background: linear-gradient(90deg, rgba(112, 45, 171, .7), rgba(55, 20, 87, .74)); color: #fff0bc; }
.lovableRankSidebar nav a i { display: grid !important; flex: 0 0 26px !important; width: 26px !important; height: 26px !important; margin-right: 10px !important; place-items: center !important; }
.lovableRankSidebar nav a i img { display: block !important; width: 26px !important; height: 26px !important; object-fit: contain !important; }
.lovableRankSidebar nav a b { position: absolute; right: 10px; width: 5px; height: 5px; border-radius: 50%; background: transparent; }
.lovableRankSidebar nav a.active b { background: #c16aff; box-shadow: 0 0 10px #bd58ff; }
.lovableRankSidebar > small { display: block; margin-top: 20px; color: #776589; font: 700 9px 'Cinzel', serif; letter-spacing: .14em; text-align: center; text-transform: uppercase; }

.mainRankingPage .lovableRankContent { min-width: 0; min-height: 680px; margin: 0 !important; padding: 0 20px 30px !important; border: 1px solid rgba(142, 66, 205, .36); border-radius: 12px; background: rgba(9, 3, 20, .92); }
.nx-original-ranking-title { min-height: 270px !important; border: 0 !important; background: url('../images/ranking-page-background.png') center / cover no-repeat !important; }
.nx-original-ranking-title::before { display: none !important; }
.nx-original-ranking-title .rankingTitleStack { display: grid !important; width: 100%; height: 100%; place-items: center; }
.nx-original-ranking-title img { width: min(420px, 55%); max-height: 210px; object-fit: contain; }

.rankingSearchBand { padding: 8px 0 18px; border-bottom: 1px solid rgba(148, 65, 204, .32); }
.rankingToolbar { display: flex; justify-content: flex-start; }
.rankingSearchInput { width: 230px !important; height: 38px !important; padding: 0 14px !important; border: 1px solid #7940a5 !important; border-radius: 7px !important; background: #100720 !important; color: #e9dcf4 !important; box-shadow: none !important; }
.rankingClassFilters { display: flex; justify-content: center; gap: 13px; margin-top: 18px; }
.rankingClassFilters a { display: grid; width: 48px; height: 48px; place-items: center; border: 1px solid rgba(159, 77, 210, .42); border-radius: 50%; background: radial-gradient(circle, #3b185a, #120821 68%); box-shadow: 0 0 16px rgba(128, 48, 190, .26); }
.rankingClassFilters img { width: 36px; height: 36px; object-fit: contain; }
.rankingTableFrame { overflow-x: auto; margin-top: 20px; border: 1px solid rgba(150, 69, 207, .34); }
.mainRankingPage table.rankingTable { width: 100% !important; min-width: 820px; border-collapse: collapse !important; }
.mainRankingPage .rankingTable thead tr { background: linear-gradient(180deg, #7540a8, #37144f) !important; }
.mainRankingPage .rankingTable thead th { height: 50px; padding: 10px 12px; border: 0; color: #f6e9bc; font: 700 10px 'Cinzel', serif; letter-spacing: .08em; text-align: center; text-transform: uppercase; }
.mainRankingPage .rankingTable tbody tr { background: rgba(10, 5, 20, .94); }
.mainRankingPage .rankingTable tbody tr:nth-child(even) { background: rgba(22, 8, 37, .94); }
.mainRankingPage .rankingTable tbody tr:hover { background: rgba(61, 21, 68, .96); }
.mainRankingPage .rankingTable tbody td { height: 60px; padding: 8px 12px !important; border-bottom: 1px solid rgba(117, 47, 160, .35) !important; color: #f2e5c3; text-align: center; }
.rankingNameCell {
  display: inline-grid;
  grid-template-columns: 9px 22px minmax(116px, 1fr);
  align-items: center;
  column-gap: 9px;
  width: 182px;
  max-width: 100%;
  margin: 0 auto;
  text-align: left;
  vertical-align: middle;
}
.rankingStatusDot {
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #70677a;
  box-shadow: none;
}
.rankingStatusDot--online {
  background: #4cf0ac;
  box-shadow: 0 0 6px rgba(76, 240, 172, .9);
}
.rankingStatusDot--offline { background: #70677a; }
.rankingCountryFlag {
  display: inline-flex;
  width: 22px;
  height: 22px;
  align-items: center;
  justify-content: center;
  overflow: visible;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
  line-height: 1;
}
.rankingCountryFlagImage {
  display: block;
  width: 22px !important;
  height: 22px !important;
  aspect-ratio: 1 / 1;
  max-width: none !important;
  margin: 0 !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100% !important;
  border: 0 !important;
  border-radius: 0 !important;
  clip-path: none !important;
  -webkit-mask: none !important;
  mask: none !important;
  background-color: transparent !important;
  box-shadow: none !important;
  filter: none !important;
}
.rankingCountryFlagEmpty {
  display: grid;
  width: 100%;
  height: 100%;
  place-items: center;
  color: #78ddff;
  font-size: 13px;
}
.rankingTableFrame .rankingClassBadge {
  display: inline-grid !important;
  grid-template-columns: 28px minmax(120px, 1fr);
  align-items: center !important;
  column-gap: 10px !important;
  width: 178px;
  max-width: 100%;
  min-height: 30px !important;
  margin: 0 auto;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  text-align: left;
  vertical-align: middle;
}
.nx-original-online-dot { width: 7px; height: 7px; border-radius: 50%; background: #47ec9d; box-shadow: 0 0 7px #41df93; }
.rankingNameLink { color: #fff1bd !important; font: 700 13px 'Cinzel', serif; text-decoration: none; }
.rankingVipBadge { width: 58px !important; max-height: 28px; object-fit: contain; }
.rankingTableFrame img.rankingClassBadgeIcon {
  display: block !important;
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  margin: 0 !important;
  object-fit: cover !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
}
.rankingClassBadge span {
  display: block;
  min-width: 0;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 12px !important;
  font-weight: 900;
  line-height: 1.25;
  text-align: left;
  white-space: nowrap;
}
.rankingPlaceMark { color: #f6c75e; font: 800 16px 'Cinzel', serif; }
.rankingTop1 { box-shadow: inset 3px 0 #e7b94e; }
.rankingTop2 { box-shadow: inset 3px 0 #8eb6e6; }
.rankingTop3 { box-shadow: inset 3px 0 #d47b53; }
.rankingStatCell,
.rankingGrandResetCell { color: #ffd75e !important; font-weight: 800; }
.rankingStatCell small { color: #baa4c8; }
.nx-original-empty { padding: 50px 12px !important; color: #9f89af !important; }

/* In waiting mode the original Hall artwork already contains the heading areas. */
.nxgh-quest-waiting .nxgh-quest-head { display: none; }
.nxgh-quest-waiting .nxgh-empty { top: 53%; }

/* Original 404/content frame. */
.nx-original-error-layout { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 25px; width: min(1460px, calc(100% - 60px)); margin: 0 auto; padding: 40px 0 90px; }
.nx-original-error-side,
.nx-original-error-layout .content { border: 1px solid rgba(146, 64, 205, .35); background: rgba(15, 5, 31, .94); }
.nx-original-error-side { min-height: 480px; padding: 28px 20px; }
.nx-original-error-side span { color: #b593c8; font: 700 12px 'Cinzel', serif; letter-spacing: .16em; text-transform: uppercase; }
.nx-original-error-side strong { display: block; margin-top: 5px; color: #f0d083; font: 800 22px 'Cinzel', serif; }
.nx-original-error-layout .content { min-height: 480px; padding: 28px 34px; }
.nx-original-error-layout .content h2 { margin: 16px 0 6px; color: #f0d083; font: 800 27px 'Cinzel', serif; }
.nx-original-error-layout .content p { color: #bda7cc; }
.nx-original-error-layout .content a { display: inline-flex; margin-top: 20px; padding: 11px 18px; border: 1px solid #984ad2; color: #f0d083; font: 700 12px 'Cinzel', serif; text-decoration: none; text-transform: uppercase; }

@media (max-width: 980px) {
  .mainRankingPage { grid-template-columns: 1fr; width: calc(100vw - 28px) !important; }
  .mainRankingPage .lovableRankSidebar { width: 100% !important; }
  .lovableRankSidebar nav { grid-template-columns: repeat(3, 1fr); }
  .nx-original-character-grid { grid-template-columns: repeat(2, 1fr); }
  .nx-original-trophy-room > div { grid-template-columns: repeat(3, 1fr); }
  .nx-original-error-layout { grid-template-columns: 1fr; }
  .nx-original-error-side { display: none; }
}

@media (max-width: 700px) {
  .nx-original-login-page { min-height: 620px; padding-top: 28px; }
  .nx-original-account-page { overflow-x: auto; padding-left: 0; padding-right: 0; }
  .nxAccountPanel { min-width: 720px; margin-left: 12px; }
  .nx-original-character-grid { grid-template-columns: 1fr; }
  .nx-original-profile-page { overflow-x: auto; }
  .nx-armory-original { width: 920px; margin-left: 10px; }
  .nx-original-trophy-room { width: 880px; margin-left: 20px; }
  .nx-original-trophy-room > div { grid-template-columns: repeat(5, 1fr); }
  .lovableRankSidebar nav { grid-template-columns: repeat(2, 1fr); }
  .nx-original-ranking-title { min-height: 190px !important; }
  .mainRankingPage .lovableRankContent { padding-left: 10px !important; padding-right: 10px !important; }
}