.referral-list-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-sizing:border-box;width:100%;color:var(--text-primary);border-radius:16px;flex-direction:column;gap:1rem;display:flex}.ref-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;display:flex}.ref-header h3{color:var(--text-primary);margin:0;font-size:1.2rem;font-weight:600}.ref-stats{gap:15px;display:flex}.ref-stat-item{border:1px solid color-mix(in srgb,var(--border)20%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff08;border-radius:12px;align-items:center;gap:8px;padding:8px 16px;display:flex}.ref-stat-val{color:var(--accent-green);font-size:1.1rem;font-weight:700}.ref-stat-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;font-size:.8rem}.ref-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;display:grid}.ref-tile{border:1px solid color-mix(in srgb,var(--border)20%,transparent);background:#ffffff05;border-radius:10px;align-items:center;gap:8px;padding:10px 12px;display:flex}.ref-tile-avatar{flex-shrink:0}.ref-avatar{object-fit:cover;border-radius:10px;width:32px;min-width:32px;height:32px}.ref-tile-content{min-width:0}.ref-name{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:.9rem;font-weight:500;overflow:hidden}.ref-date{color:var(--text-secondary);opacity:.8;font-size:.75rem}.ref-pagination{color:var(--text-secondary);align-items:center;gap:20px;font-size:.95rem;display:flex}.ref-pagination button{border:1px solid color-mix(in srgb,var(--border)20%,transparent);color:var(--text-primary);cursor:pointer;background:#ffffff0d;border-radius:12px;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.1rem;transition:all .2s;display:flex}.ref-pagination button:disabled{opacity:.3;cursor:not-allowed;transform:none}.ref-loading,.ref-empty,.ref-error{text-align:center;color:var(--text-secondary);padding:40px 20px;font-size:1rem}@media (max-width:900px){.ref-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:768px){.ref-header{flex-direction:column;align-items:flex-start;gap:16px}.ref-stats{justify-content:space-between;width:100%}.ref-name{font-size:.95rem}}@media (max-width:600px){.ref-tile{padding:8px 10px}.ref-avatar{width:28px;height:28px}}@media (max-width:480px){.ref-stat-item{padding:6px 12px}.ref-pagination{gap:12px}.ref-pagination button{width:36px;height:36px}}