/* Clean roster layout — preserves the site's original visual identity. */
.space-y-8.mb-16 > .grid {
  display: flex !important;
  flex-direction: column;
  gap: 0.9rem !important;
}

.space-y-8.mb-16 > .grid > .sd-card {
  width: 100%;
  min-height: 88px;
  display: grid !important;
  grid-template-columns: 46px 62px minmax(0, 1fr);
  align-items: center !important;
  padding: 12px 18px !important;
  text-align: left !important;
  overflow: hidden !important;
  transition: transform 160ms ease, box-shadow 160ms ease;
}

.space-y-8.mb-16 > .grid > .sd-card:hover {
  transform: translateY(-2px);
}

/* Rank */
.space-y-8.mb-16 > .grid > .sd-card > div:first-child {
  position: static !important;
  z-index: 1 !important;
  padding: 0 !important;
  opacity: 0.18 !important;
  font-size: 44px !important;
  line-height: 1 !important;
  text-align: left;
}

/* Avatar */
.space-y-8.mb-16 > .grid > .sd-card > div:nth-child(2) {
  width: 54px !important;
  height: 54px !important;
  margin: 0 !important;
  border-width: 3px !important;
}

/* Name, nickname, points and sessions */
.space-y-8.mb-16 > .grid > .sd-card > div:nth-child(3) {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(170px, 1fr) 155px 128px;
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: 16px;
  padding-left: 16px;
}

.space-y-8.mb-16 > .grid > .sd-card h3 {
  grid-column: 1;
  grid-row: 1;
  font-size: 1.15rem !important;
  line-height: 1.15;
}

.space-y-8.mb-16 > .grid > .sd-card h3 + p {
  grid-column: 1;
  grid-row: 2;
  margin: 3px 0 0 !important;
  font-size: 0.65rem !important;
}

.space-y-8.mb-16 > .grid > .sd-card h3 + p + div {
  grid-column: 2;
  grid-row: 1 / 3;
  margin: 0 !important;
  padding: 7px 12px !important;
}

.space-y-8.mb-16 > .grid > .sd-card h3 + p + div span:last-child {
  font-size: 1.75rem !important;
}

.space-y-8.mb-16 > .grid > .sd-card h3 + p + div + div {
  grid-column: 3;
  grid-row: 1 / 3;
  margin: 0 !important;
  text-align: right;
  font-size: 0.66rem !important;
}

@media (max-width: 640px) {
  .space-y-8.mb-16 > .grid > .sd-card {
    min-height: 78px;
    grid-template-columns: 34px 50px minmax(0, 1fr);
    padding: 10px !important;
  }

  .space-y-8.mb-16 > .grid > .sd-card > div:first-child {
    font-size: 30px !important;
  }

  .space-y-8.mb-16 > .grid > .sd-card > div:nth-child(2) {
    width: 44px !important;
    height: 44px !important;
  }

  .space-y-8.mb-16 > .grid > .sd-card > div:nth-child(3) {
    grid-template-columns: minmax(100px, 1fr) 92px;
    column-gap: 8px;
    padding-left: 8px;
  }

  .space-y-8.mb-16 > .grid > .sd-card h3 {
    font-size: 0.95rem !important;
  }

  .space-y-8.mb-16 > .grid > .sd-card h3 + p {
    font-size: 0.55rem !important;
  }

  .space-y-8.mb-16 > .grid > .sd-card h3 + p + div {
    grid-column: 2;
    padding: 5px 6px !important;
  }

  .space-y-8.mb-16 > .grid > .sd-card h3 + p + div span:last-child {
    font-size: 1.35rem !important;
  }

  .space-y-8.mb-16 > .grid > .sd-card h3 + p + div + div {
    display: none;
  }
}
