.friends-container{padding-bottom:50px;animation:fadeIn .4s ease-out}.friends-container .friends-header{background:#fff;border:1px solid rgba(0,0,0,.05);border-radius:20px;padding:30px;margin-bottom:30px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 4px 20px rgba(0,0,0,.02)}.friends-container .friends-header .header-content h1{font-size:2rem;font-weight:800;margin-bottom:4px;color:#1e293b}.friends-container .friends-header .header-content p{color:#64748b;font-size:1rem}.friends-container .friends-header .header-stats{display:flex;gap:24px}.friends-container .friends-header .header-stats .stat-item{text-align:center}.friends-container .friends-header .header-stats .stat-item .count{display:block;font-size:1.5rem;font-weight:800;color:#3b82f6}.friends-container .friends-header .header-stats .stat-item .label{font-size:.75rem;color:#94a3b8;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.friends-container .friends-tabs{display:flex;gap:8px;margin-bottom:30px;background:#f1f5f9;padding:6px;border-radius:14px;width:-moz-fit-content;width:fit-content}.friends-container .friends-tabs .tab-btn{padding:10px 20px;border-radius:10px;font-size:.9rem;font-weight:600;color:#64748b;transition:all .2s;cursor:pointer}.friends-container .friends-tabs .tab-btn:hover{color:#1e293b;background:hsla(0,0%,100%,.5)}.friends-container .friends-tabs .tab-btn.active{background:#fff;color:#3b82f6;box-shadow:0 4px 12px rgba(0,0,0,.05)}.friends-container .friends-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));grid-gap:20px;gap:20px}.friends-container .friends-grid .friend-card{background:#fff;border:1px solid #e2e8f0;border-radius:20px;padding:24px;display:flex;flex-direction:column;align-items:center;text-align:center;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.friends-container .friends-grid .friend-card:hover{transform:translateY(-5px);box-shadow:0 10px 30px rgba(0,0,0,.05);border-color:#3b82f6}.friends-container .friends-grid .friend-card .card-bg{position:absolute;top:0;left:0;right:0;height:80px;background:linear-gradient(135deg,rgba(59,130,246,.1),rgba(139,92,246,.1));z-index:0}.friends-container .friends-grid .friend-card .avatar-wrapper{position:relative;z-index:1;margin-top:20px;margin-bottom:16px}.friends-container .friends-grid .friend-card .avatar-wrapper .avatar{width:100px;height:100px;border-radius:50%;border:4px solid #fff;box-shadow:0 4px 15px rgba(0,0,0,.1);object-fit:cover;background:#f1f5f9}.friends-container .friends-grid .friend-card .avatar-wrapper .status-indicator{position:absolute;bottom:8px;right:8px;width:18px;height:18px;border-radius:50%;border:3px solid #fff;background:#10b981}.friends-container .friends-grid .friend-card .info{z-index:1;margin-bottom:24px}.friends-container .friends-grid .friend-card .info h3{font-size:1.1rem;font-weight:700;margin:0 0 4px;color:#1e293b}.friends-container .friends-grid .friend-card .info p{font-size:.85rem;color:#64748b;margin:0}.friends-container .friends-grid .friend-card .actions{z-index:1;display:flex;gap:10px;width:100%}.friends-container .friends-grid .friend-card .actions button{flex:1 1;padding:10px;border-radius:12px;font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s}.friends-container .friends-grid .friend-card .actions .btn-primary{background:#3b82f6;color:#fff}.friends-container .friends-grid .friend-card .actions .btn-primary:hover{background:#2563eb;transform:translateY(-2px)}.friends-container .friends-grid .friend-card .actions .btn-secondary{background:#f1f5f9;color:#475569}.friends-container .friends-grid .friend-card .actions .btn-secondary:hover{background:#e2e8f0}.friends-container .friends-grid .friend-card .actions .btn-danger{background:#fee2e2;color:#ef4444}.friends-container .friends-grid .friend-card .actions .btn-danger:hover{background:#fecaca}.friends-container .empty-state{text-align:center;padding:80px 20px;background:#fff;border:1px solid #e2e8f0;border-radius:24px}.friends-container .empty-state .icon{font-size:4rem;margin-bottom:20px;display:block}.friends-container .empty-state h2{font-size:1.5rem;color:#1e293b;margin-bottom:10px}.friends-container .empty-state p{color:#64748b;margin-bottom:24px}.friends-container .empty-state .btn-discovery{display:inline-block;padding:12px 30px;background:#3b82f6;color:#fff;border-radius:100px;font-weight:600;text-decoration:none;transition:all .2s}.friends-container .empty-state .btn-discovery:hover{transform:translateY(-2px);box-shadow:0 4px 15px rgba(59,130,246,.4)}.friends-container .loading-state{text-align:center;padding:100px 0;color:#64748b}.friends-container .loading-state .spinner{width:40px;height:40px;border:4px solid #f1f5f9;border-top-color:#3b82f6;border-radius:50%;margin:0 auto 20px;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}