/* 前三名卡片 */
.top3-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 30px;
}
.top3-card {
    background: #fff;
    border: 1px solid #d9e5f5;
    padding: 24px 20px;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.top3-card.gold { border-top: 3px solid #f0c040; }
.top3-card.silver { border-top: 3px solid #a8b8c8; }
.top3-card.bronze { border-top: 3px solid #c89870; }
.top3-rank {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 12px;
}
.top3-card.gold .top3-rank { color: #c8960c; }
.top3-card.silver .top3-rank { color: #6b7d8e; }
.top3-card.bronze .top3-rank { color: #a06840; }
.top3-icon img {
    width: 64px;
    height: 64px;
    border-radius: 16px;
    margin-bottom: 10px;
}
.top3-name {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 6px;
}
.top3-name a { color: #1e293b; text-decoration: none; }
.top3-name a:hover { color: #f97316; }
.top3-meta {
    font-size: 13px;
    color: #7f8fa4;
    margin-bottom: 8px;
}
.top3-stat {
    font-size: 13px;
    color: #f97316;
    font-weight: 500;
}

/* 排名列表表格 */
.rank-table-wrap {
    background: #fff;
    border: 1px solid #d9e5f5;
    margin-bottom: 30px;
    overflow-x: auto;
}
.rank-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}
.rank-table thead th {
    background: #f4f7fc;
    color: #4b556b;
    font-weight: 600;
    padding: 14px 16px;
    text-align: left;
    white-space: nowrap;
    border-bottom: 2px solid #d9e5f5;
}
.rank-table tbody td {
    padding: 11px 16px;
    border-bottom: 1px solid #eef3fa;
    vertical-align: middle;
}
.rank-table tbody tr:hover { background: #fafcff; }
.rank-table tbody tr:last-child td { border-bottom: none; }
.rank-table .col-rank { width: 70px; text-align: center; }
.rank-table .col-cat { width: 100px; color: #566f8f; font-size: 13px; }
.rank-table .col-size { width: 90px; color: #7f8fa4; font-size: 13px; }
.rank-table .col-down { width: 90px; color: #f97316; font-weight: 500; font-size: 13px; }

.rank-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    font-weight: 700;
    font-size: 14px;
    color: #7f8fa4;
}
.rank-num.top1 { background: #fff3cd; color: #c8960c; border-radius: 50%; }
.rank-num.top2 { background: #eef2f7; color: #6b7d8e; border-radius: 50%; }
.rank-num.top3 { background: #fce8db; color: #a06840; border-radius: 50%; }

.rank-item-info {
    display: flex;
    align-items: center;
    gap: 12px;
}
.rank-item-icon {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    flex-shrink: 0;
}
.rank-item-name {
    font-weight: 500;
    color: #1e293b;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.rank-item-name:hover { color: #f97316; }

.side-content .active {
    color: #176bf0;
}
.rank-table-wrap {
    text-align: center;
    padding: 60px 20px;
    color: #7f8fa4;
}
/* 响应式 */
@media (max-width: 768px) {
    .top3-row { grid-template-columns: 1fr; }
}