.user-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;margin-top:18px;margin-bottom:28px;contain:layout style;}
.user-grid-5-cols{grid-template-columns:repeat(5,1fr);}
.user-card{background:var(--bg-card);border-radius:20px;padding:16px 12px;transition:transform 0.2s ease,border-color 0.2s ease;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;overflow:hidden;border:2px solid var(--border-primary);contain:layout style paint;}
.user-card:hover{transform:translateY(-4px);border-color:rgba(255,102,0,0.5);}
[data-theme="light"] .user-card{background:#fff;}
[data-theme="light"] .user-card:hover{border-color:rgba(255,102,0,0.6);}
.user-card > a{text-decoration:none;color:inherit;display:flex;flex-direction:column;align-items:center;width:100%;}
.user-card .user-avatar-large{width:120px;height:120px;border-radius:16px;overflow:hidden;border:4px solid var(--primary-color);margin-bottom:10px;transition:transform 0.2s ease;background:var(--bg-secondary);display:flex;align-items:center;justify-content:center;position:relative;}
.user-card:hover .user-avatar-large{transform:scale(1.05);}
.user-avatar-large img{width:100%;height:100%;object-fit:cover;}
.user-avatar-large .icon{width:56px;height:56px;fill:var(--text-meta);}
.user-info-card{width:100%;margin-bottom:0;}
.user-name{font-size:18px;font-weight:700;color:var(--text-primary);margin:0 0 5px 0;word-break:break-word;transition:color 0.3s;}
.user-card:hover .user-name{color:var(--primary-color);}
.user-signature{font-size:13px;color:var(--text-secondary);margin:0 0 7px 0;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:36px;}
.user-stats{display:flex;justify-content:space-between;font-size:11px;color:var(--text-meta);flex-wrap:nowrap;}
.user-stats span{display:flex;align-items:center;gap:1px;white-space:nowrap;flex-shrink:0;}
.user-stats .icon{width:14px;height:14px;fill:currentColor;}
.user-actions{width:80%;margin-top:auto;margin-left:auto;margin-right:auto;display:flex;flex-direction:column;gap:7px;}
.follow-btn,.visit-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;padding:8px 20px;border:2px solid var(--primary-color);background:transparent;color:var(--primary-color);border-radius:12px;font-size:14px;font-weight:600;cursor:pointer;transition:transform 0.2s ease,background-color 0.2s ease,color 0.2s ease;position:relative;overflow:hidden;text-decoration:none;}
.follow-btn .icon,.visit-btn .icon{width:16px;height:16px;fill:currentColor;}
.follow-btn.following{background:var(--primary-color);color:white;}
.follow-btn.following:hover{background:#dc2626;border-color:#dc2626;transform:translateY(-2px);}
.follow-btn.following:hover .btn-text::before{content:'取消关注';}
.follow-btn.following:hover .btn-text span{display:none;}
.follow-btn:not(.following):hover{background:var(--primary-color);color:white;transform:translateY(-2px);}
.visit-btn{border-color:var(--border-primary);color:var(--text-primary);background:transparent;}
.visit-btn:hover{background:var(--primary-color);border-color:var(--primary-color);color:white;transform:translateY(-2px);}
.follow-btn.loading{pointer-events:none;opacity:0.6;}
.follow-btn.loading .icon{animation:spin 1s linear infinite;}
@keyframes spin{from{transform:rotate(0deg);}
to{transform:rotate(360deg);}
}
@media (max-width:1400px){.user-grid-5-cols{grid-template-columns:repeat(4,1fr);}
}
@media (max-width:992px){.user-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px;}
.user-grid-5-cols{grid-template-columns:repeat(3,1fr);}
.user-card{padding:14px 10px;}
.user-card .user-avatar-large{width:105px;height:105px;}
}
@media (max-width:768px){.user-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;}
.user-grid-5-cols{grid-template-columns:repeat(2,1fr);}
.user-card{padding:14px;}
.user-card .user-avatar-large{width:95px;height:95px;border-width:3px;}
.user-avatar-large .icon{width:44px;height:44px;}
.user-name{font-size:16px;}
.user-signature{font-size:12px;min-height:28px;}
.user-stats{font-size:11px;flex-direction:row;gap:0;}
}
@media (max-width:576px){.user-grid{grid-template-columns:1fr;gap:16px;justify-items:center;}
.user-grid-5-cols{grid-template-columns:1fr;}
.user-card{padding:16px;width:88%;margin:0 auto;}
.user-card .user-avatar-large{width:120px;height:120px;}
}
