/* RAN CHAMPION — new player/server information layout */
html,
body.rc-new-players-page {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
}

body.rc-new-players-page {
  color: var(--rc-text-main) !important;
  background-color: var(--rc-bg-main) !important;
  background-image:
    radial-gradient(circle at 50% 0, rgba(210, 166, 74, .12), transparent 34rem),
    linear-gradient(180deg, #080808 0%, #101010 52%, #080808 100%) !important;
  font-family: "Noto Sans Thai", Tahoma, system-ui, -apple-system, "Segoe UI", sans-serif !important;
  font-size: 16px !important;
  line-height: 1.7 !important;
}

.rc-new-players-page > #particles-js,
.rc-new-players-page > .wrapper {
  display: none !important;
}

/* Remove the old fixed 1200px table canvas without removing its content. */
.rc-new-players-page .header_table,
.rc-new-players-page .header_table > table,
.rc-new-players-page .header_table > table > tbody,
.rc-new-players-page .header_table > table > tbody > tr,
.rc-new-players-page .header_table > table > tbody > tr > td {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}

.rc-new-players-page .header_table { overflow: visible !important; }

.rc-new-players-page .rc-wrap,
.rc-new-players-page .header_table .section,
.rc-new-players-page .header_table > table > tbody > tr > td > .card.job {
  width: min(calc(100% - 40px), 1240px) !important;
  max-width: 1240px !important;
  margin-inline: auto !important;
}

.rc-new-players-page .rc-wrap {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: clamp(52px, 7vw, 92px) 0 32px !important;
}

.rc-new-players-page .rc-hero {
  grid-column: 1 / -1;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin: 0 !important;
  padding: clamp(38px, 5vw, 64px) !important;
  border: 1px solid var(--rc-border-gold) !important;
  border-radius: var(--rc-radius-lg) !important;
  background:
    radial-gradient(circle at 50% 0, rgba(210, 166, 74, .18), transparent 28rem),
    linear-gradient(180deg, #17140e, #0d0d0d) !important;
  box-shadow: var(--rc-shadow-lg) !important;
  text-align: center;
}

.rc-new-players-page .rc-hero h2 {
  margin: 0 0 22px !important;
  border: 0 !important;
  color: var(--rc-text-main) !important;
  font-size: clamp(2rem, 4vw, 3.25rem) !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
}

.rc-new-players-page .rc-badges {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px !important;
  margin: 0 !important;
}

.rc-new-players-page .bad,
.rc-new-players-page .chip {
  min-height: 42px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  padding: 8px 14px !important;
  border: 1px solid var(--rc-border-gold) !important;
  border-radius: 999px !important;
  font-size: 1rem !important;
  font-weight: 500 !important;
}

.rc-new-players-page .bad.red { color: #ffc8c8 !important; background: rgba(239, 107, 107, .1) !important; }
.rc-new-players-page .bad.green { color: #cdf3d7 !important; background: rgba(119, 200, 144, .1) !important; }
.rc-new-players-page .chip { margin-left: 6px; color: var(--rc-gold-light) !important; background: var(--rc-gold-soft) !important; }

.rc-new-players-page .rc-card,
.rc-new-players-page .section {
  min-width: 0;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: clamp(22px, 3vw, 34px) !important;
  border: 1px solid var(--rc-border) !important;
  border-radius: var(--rc-radius-lg) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .025), transparent), rgba(18, 18, 18, .96) !important;
  box-shadow: var(--rc-shadow-sm) !important;
}

.rc-new-players-page .rc-wrap > .rc-card:nth-of-type(n + 3) { grid-column: 1 / -1; }

.rc-new-players-page .rc-card:hover,
.rc-new-players-page .section:hover,
.rc-new-players-page .card:hover {
  transform: none !important;
}

.rc-new-players-page .rc-card h3,
.rc-new-players-page .section > h2 {
  margin: 0 0 22px !important;
  padding: 0 0 14px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--rc-border-gold) !important;
  color: var(--rc-gold-light) !important;
  font-size: clamp(1.45rem, 2vw, 1.85rem) !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
}

.rc-new-players-page .rc-sub,
.rc-new-players-page .rc-list,
.rc-new-players-page .rc-time,
.rc-new-players-page .rc-times,
.rc-new-players-page .section p,
.rc-new-players-page .section li,
.rc-new-players-page .card p,
.rc-new-players-page .card li {
  color: var(--rc-text-secondary) !important;
  font-size: 1.04rem !important;
  line-height: 1.75 !important;
}

.rc-new-players-page .rc-list { margin: 0 !important; padding: 0 !important; list-style: none !important; }
.rc-new-players-page .rc-list li { padding: 8px 0 !important; border-bottom: 1px solid var(--rc-border) !important; }
.rc-new-players-page .rc-list li:last-child { border-bottom: 0 !important; }
.rc-new-players-page .rc-list b { color: var(--rc-text-main) !important; font-weight: 600 !important; }
.rc-new-players-page .rc-list.check li { padding-left: 28px !important; }
.rc-new-players-page .rc-list.check li::before { color: var(--rc-gold) !important; }

.rc-new-players-page .rc-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

.rc-new-players-page .rc-grid > .rc-list,
.rc-new-players-page .rc-split > div,
.rc-new-players-page .grid > .card,
.rc-new-players-page .card.job {
  min-width: 0;
  padding: 20px !important;
  border: 1px solid var(--rc-border) !important;
  border-radius: var(--rc-radius-md) !important;
  background: rgba(255, 255, 255, .025) !important;
  box-shadow: none !important;
}

.rc-new-players-page .rc-split {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

.rc-new-players-page .rc-split h2,
.rc-new-players-page .card h3 {
  margin: 0 0 12px !important;
  border: 0 !important;
  color: var(--rc-text-main) !important;
  font-size: 1.16rem !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
}

.rc-new-players-page .header_table .section {
  margin-top: 20px !important;
}

.rc-new-players-page .header_table .section:first-of-type { margin-top: 0 !important; }

.rc-new-players-page .header_table .grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)) !important;
  gap: 14px !important;
}

.rc-new-players-page .header_table .section > .card.job {
  margin: 12px 0 0 !important;
}

.rc-new-players-page .header_table .section > .card.job,
.rc-new-players-page .header_table > table > tbody > tr > td > .card.job {
  border-left: 3px solid var(--rc-gold) !important;
}

.rc-new-players-page .header_table > table > tbody > tr > td > .card.job {
  margin-top: 12px !important;
  padding: 20px !important;
  border-top: 1px solid var(--rc-border) !important;
  border-right: 1px solid var(--rc-border) !important;
  border-bottom: 1px solid var(--rc-border) !important;
  border-radius: var(--rc-radius-md) !important;
  background: rgba(18, 18, 18, .96) !important;
}

.rc-new-players-page .page_footer {
  width: 100% !important;
  margin-top: clamp(48px, 7vw, 84px) !important;
  text-align: center;
}

.rc-new-players-page .footer_container {
  display: flex !important;
  flex-direction: column;
  gap: 4px;
}

@media (max-width: 1024px) {
  .rc-new-players-page .rc-wrap { grid-template-columns: 1fr; }
  .rc-new-players-page .rc-wrap > .rc-card { grid-column: 1; }
  .rc-new-players-page .rc-grid { grid-template-columns: 1fr !important; }
}

@media (max-width: 760px) {
  .rc-new-players-page .rc-wrap,
  .rc-new-players-page .header_table .section,
  .rc-new-players-page .header_table > table > tbody > tr > td > .card.job {
    width: min(calc(100% - 24px), 1240px) !important;
  }
  .rc-new-players-page .rc-split,
  .rc-new-players-page .header_table .grid { grid-template-columns: 1fr !important; }
  .rc-new-players-page .rc-card,
  .rc-new-players-page .section { padding: 20px !important; border-radius: var(--rc-radius-md) !important; }
  .rc-new-players-page .rc-badges { align-items: stretch; flex-direction: column; }
  .rc-new-players-page .bad { width: 100%; }
}

@media (max-width: 430px) {
  .rc-new-players-page .rc-wrap { padding-top: 32px !important; }
  .rc-new-players-page .rc-hero,
  .rc-new-players-page .rc-card,
  .rc-new-players-page .section { padding: 17px !important; }
  .rc-new-players-page .rc-grid > .rc-list,
  .rc-new-players-page .rc-split > div,
  .rc-new-players-page .grid > .card { padding: 16px !important; }
}
