.pageContainer {
  padding: 24px;
  min-height: 100vh;
}

.proTable {
  background: rgba(255, 255, 255, 70%) !important;
  backdrop-filter: blur(20px) saturate(160%);
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 35%);
  box-shadow: 0 10px 40px rgba(0, 0, 0, 4%);
  overflow: hidden;
}

.tableSearch {
  margin-bottom: 16px;
  background: rgba(255, 255, 255, 45%) !important;
  backdrop-filter: blur(12px);
  border-radius: 16px !important;
  border: 1px solid rgba(255, 255, 255, 25%);
}

.rankBadge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  font-weight: bold;
  font-size: 16px;
  color: #fff;
}

.rank1 {
  background: linear-gradient(135deg, #fceabb 0%, #f8b500 100%);
  box-shadow: 0 4px 10px rgba(248, 181, 0, 30%);
}

.rank2 {
  background: linear-gradient(135deg, #e6e9f0 0%, #eef1f5 100%);
  color: #666;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 5%);
}

.rank3 {
  background: linear-gradient(135deg, #f6d365 0%, #fda085 100%);
  box-shadow: 0 4px 10px rgba(253, 160, 133, 30%);
}

.rankOther {
  background: rgba(0, 0, 0, 5%);
  color: #999;
}

.titleCell {
  display: flex;
  align-items: center;
  gap: 12px;
}

.cover {
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 8%);
  object-fit: crop;
}

.trendUp {
  color: #f5222d;
}

.trendDown {
  color: #52c41a;
}

.trendStable {
  color: #faad14;
}
