@charset "UTF-8";

/* Apex Tale — placar de liderança da home. */
#community .media[data-home-rankings-api] {
  --rb-gold: #e9bd55;
  --rb-gold-bright: #f3d37d;
  --rb-line: rgba(211, 153, 43, .4);
  position: relative;
}

#community .rb-srv-tabs { display: none !important; }

#community .rb-tabs,
#community .rb-tabs[style] {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(12rem, 17rem)) !important;
  justify-content: center !important;
  gap: .8rem !important;
  width: min(100%, 64rem) !important;
  margin: 0 auto .8rem !important;
  padding: 1rem 1.25rem !important;
  border: 1px solid rgba(212, 151, 37, .58) !important;
  border-radius: .7rem !important;
  background: linear-gradient(145deg, rgba(31, 21, 10, .73), rgba(4, 5, 6, .9)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 223, 147, .05), 0 1rem 3rem rgba(0, 0, 0, .3) !important;
}

#community #rb-tabs-clans {
  grid-template-columns: repeat(2, minmax(14rem, 20rem)) !important;
  width: min(100%, 50rem) !important;
}

#community .rb-tab {
  position: relative !important;
  isolation: isolate;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: .8rem !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 4.75rem !important;
  padding: .85rem 1.25rem !important;
  overflow: hidden !important;
  border: 1px solid rgba(211, 151, 43, .65) !important;
  border-radius: .3rem !important;
  background: linear-gradient(180deg, rgba(25, 23, 20, .94), rgba(7, 8, 9, .98)) !important;
  color: #efd17f !important;
  -webkit-text-fill-color: #efd17f !important;
  cursor: pointer;
  font-family: var(--font-1, "ChelseaCYR", serif) !important;
  font-size: clamp(.9rem, 1.15vw, 1.12rem) !important;
  font-weight: 700 !important;
  letter-spacing: .065em !important;
  line-height: 1.1 !important;
  text-align: center;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .9) !important;
  text-transform: uppercase !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035), inset 0 0 1.5rem rgba(189, 121, 24, .025) !important;
  transition: transform .2s ease, border-color .22s ease, background .22s ease, box-shadow .22s ease !important;
}

#community .rb-tab::before {
  content: "" !important;
  position: absolute !important;
  inset: .3rem !important;
  z-index: -1;
  display: block !important;
  pointer-events: none;
  background:
    linear-gradient(var(--rb-gold), var(--rb-gold)) left top / .85rem 1px no-repeat,
    linear-gradient(var(--rb-gold), var(--rb-gold)) left top / 1px .85rem no-repeat,
    linear-gradient(var(--rb-gold), var(--rb-gold)) right top / .85rem 1px no-repeat,
    linear-gradient(var(--rb-gold), var(--rb-gold)) right top / 1px .85rem no-repeat,
    linear-gradient(var(--rb-gold), var(--rb-gold)) left bottom / .85rem 1px no-repeat,
    linear-gradient(var(--rb-gold), var(--rb-gold)) left bottom / 1px .85rem no-repeat,
    linear-gradient(var(--rb-gold), var(--rb-gold)) right bottom / .85rem 1px no-repeat,
    linear-gradient(var(--rb-gold), var(--rb-gold)) right bottom / 1px .85rem no-repeat !important;
  opacity: .68;
  filter: none !important;
  transition: opacity .22s ease;
}

#community .rb-tab::after { content: none !important; }
#community .rb-tab .tgem { display: none !important; }

#community .rb-tab-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.15rem;
  height: 2.15rem;
  flex: 0 0 2.15rem;
  color: var(--rb-gold-bright);
  filter: drop-shadow(0 0 .4rem rgba(225, 166, 52, .28));
}

#community .rb-tab-icon svg { display: block; width: 100%; height: 100%; fill: currentColor; }

#community .rb-tab:hover,
#community .rb-tab:focus-visible {
  border-color: rgba(242, 191, 83, .92) !important;
  background: linear-gradient(180deg, rgba(58, 40, 18, .94), rgba(12, 11, 10, .99)) !important;
  color: #ffe5a0 !important;
  -webkit-text-fill-color: #ffe5a0 !important;
  box-shadow: 0 0 1.35rem rgba(220, 155, 34, .2), inset 0 1px 0 rgba(255, 231, 171, .08) !important;
  transform: translateY(-2px) !important;
  outline: none;
}

#community .rb-tab:hover::before,
#community .rb-tab:focus-visible::before { opacity: 1; }

#community .rb-tab.active,
#community .rb-tab.is-active {
  border-color: #efb13b !important;
  background: linear-gradient(145deg, #dea329 0%, #9b6015 58%, #633708 100%) !important;
  color: #fff5d7 !important;
  -webkit-text-fill-color: #fff5d7 !important;
  text-shadow: 0 1px 2px rgba(42, 20, 0, .92) !important;
  box-shadow: 0 0 1rem rgba(234, 173, 48, .38), inset 0 1px 0 rgba(255, 239, 184, .55), inset 0 -.8rem 1.5rem rgba(91, 43, 3, .24) !important;
}

#community .rb-tab.active::before { opacity: 1; }
#community .rb-tab.active .rb-tab-icon { color: #fff0a2; }

#community .rb-table-wrap {
  width: 100%;
  margin-top: 1.2rem !important;
  overflow: hidden !important;
  border: 1px solid var(--rb-line) !important;
  border-radius: .55rem !important;
  background: rgba(6, 7, 8, .94) !important;
  box-shadow: 0 1.5rem 4rem rgba(0, 0, 0, .44), inset 0 1px 0 rgba(255, 225, 150, .035) !important;
}

#community .rb-table {
  width: 100% !important;
  min-width: 42rem;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background: transparent !important;
}

#community .rb-thead th {
  height: 3.7rem;
  padding: .85rem 1.35rem !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(231, 173, 58, .5) !important;
  background: linear-gradient(180deg, rgba(79, 48, 18, .82), rgba(39, 27, 15, .86)) !important;
  color: #ebc264 !important;
  font-size: .78rem !important;
  font-weight: 800 !important;
  letter-spacing: .12em !important;
  text-shadow: 0 2px 5px rgba(0, 0, 0, .9) !important;
  text-transform: uppercase !important;
  vertical-align: middle !important;
}

#community #dtbody td {
  height: 4.7rem;
  padding: .8rem 1.35rem !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255, 255, 255, .055) !important;
  background: rgba(11, 12, 13, .96) !important;
  color: #eee9df !important;
  font-size: .9rem !important;
  font-weight: 600 !important;
  text-shadow: 0 1px 4px rgba(0, 0, 0, .76) !important;
  vertical-align: middle !important;
}

#community #dtbody tr:nth-child(even) td { background: rgba(20, 21, 22, .95) !important; }
#community #dtbody tr:hover td { background: linear-gradient(90deg, rgba(73, 47, 18, .58), rgba(19, 18, 16, .98)) !important; }
#community #dtbody tr.gold td { background: linear-gradient(90deg, rgba(116, 79, 18, .66), rgba(29, 22, 12, .97) 55%, rgba(12, 12, 12, .98)) !important; border-bottom-color: rgba(229, 172, 56, .48) !important; }
#community #dtbody tr.silver td { background: linear-gradient(90deg, rgba(100, 105, 114, .36), rgba(20, 22, 25, .97) 52%, rgba(12, 12, 13, .98)) !important; }
#community #dtbody tr.bronze td { background: linear-gradient(90deg, rgba(124, 65, 27, .46), rgba(28, 19, 14, .97) 52%, rgba(13, 12, 11, .98)) !important; }
#community #dtbody tr.gold:hover td { background: linear-gradient(90deg, rgba(137, 95, 24, .72), rgba(36, 27, 14, .98) 55%, rgba(15, 14, 12, .98)) !important; }
#community #dtbody tr.silver:hover td { background: linear-gradient(90deg, rgba(114, 119, 128, .42), rgba(27, 28, 31, .98) 52%, rgba(14, 14, 15, .98)) !important; }
#community #dtbody tr.bronze:hover td { background: linear-gradient(90deg, rgba(142, 76, 32, .52), rgba(35, 24, 17, .98) 52%, rgba(15, 13, 12, .98)) !important; }

#community #dtbody tr:nth-child(-n+3) td:first-child::before { content: none !important; }

#community .rbadge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.1rem;
  height: 2.1rem;
  clip-path: polygon(50% 0, 91% 20%, 100% 68%, 50% 100%, 0 68%, 9% 20%);
  border-radius: 0;
  background: rgba(16, 16, 17, .92);
  color: #c8c3b9;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .16);
  font-weight: 700;
}

#community tr.gold .rbadge { background: linear-gradient(145deg, #f5dc82, #c58b1e 58%, #75450a); color: #2a1603; box-shadow: 0 0 .8rem rgba(221, 165, 47, .35); }
#community tr.silver .rbadge { background: linear-gradient(145deg, #f0f1f3, #a9afb8 58%, #606875); color: #181b20; box-shadow: 0 0 .7rem rgba(193, 199, 208, .24); }
#community tr.bronze .rbadge { background: linear-gradient(145deg, #e0aa73, #a35f2b 58%, #603315); color: #fff1e2; box-shadow: 0 0 .7rem rgba(178, 99, 43, .24); }

#community .pname-w,
#community .clan-w { display: flex; align-items: center; gap: .75rem; }
#community .clan-w { display: inline-flex; }

#community .rb-cls-avatar {
  display: block;
  width: 2.55rem !important;
  height: 2.55rem !important;
  flex: 0 0 2.55rem;
  border: 1px solid rgba(222, 170, 69, .38);
  border-radius: 50%;
  background: #080808;
  box-shadow: 0 .2rem .65rem rgba(0, 0, 0, .58);
  object-fit: cover;
}

#community .pname { color: #ece8df; font-weight: 700; letter-spacing: .015em; }
#community tr.gold .pname { color: #f0c96d; }
#community tr.silver .pname { color: #ece9e3; }
#community tr.bronze .pname { color: #e7bb91; }

#community .sval {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.7rem;
  min-height: 2.2rem;
  padding: .3rem .65rem;
  border: 1px solid rgba(193, 148, 65, .25);
  border-radius: .35rem;
  background: rgba(8, 8, 8, .5);
  color: #eee9df;
  font-weight: 700;
}

#community .xval,
#community .clan-txt { color: #e9e5dd; font-weight: 650; }

#community .clan-img {
  display: block;
  width: 2.25rem !important;
  height: 2.25rem !important;
  flex: 0 0 2.25rem;
  border: 1px solid rgba(222, 170, 69, .28);
  border-radius: .2rem;
  background: #050505;
  object-fit: contain;
}

@media (max-width: 767.98px) {
  #community .rb-tabs,
  #community .rb-tabs[style] {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    width: 100% !important;
    overflow-x: auto !important;
    padding: .65rem !important;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
  }
  #community .rb-tab { min-width: 11.5rem !important; min-height: 4rem !important; }
  #community .rb-tab-icon { width: 1.85rem; height: 1.85rem; flex-basis: 1.85rem; }
  #community .rb-table-wrap { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
  #community .rb-thead th,
  #community #dtbody td { padding: .72rem .8rem !important; }
}

@media (prefers-reduced-motion: reduce) {
  #community .rb-tab { transition: none !important; }
}