.conn-wrap{display:flex;flex-direction:column;gap:18px}.conn-page-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;padding:4px 0 6px}.conn-page-title{display:flex;align-items:center;gap:10px;font-size:1.35rem;font-weight:800;color:var(--dark)}.conn-page-title > i{color:var(--primary);font-size:1.15rem}.conn-total-badge{background:var(--bg);border:1px solid var(--border);color:var(--gray);font-size:0.78rem;font-weight:700;padding:2px 9px;border-radius:99px;min-width:24px;text-align:center}.conn-pending-alert{display:inline-flex;align-items:center;gap:6px;background:#fff7ed;border:1px solid #fed7aa;color:#c2410c;font-size:0.82rem;font-weight:700;padding:5px 13px;border-radius:99px;animation:pulse-amber 2.5s ease-in-out infinite}.conn-pending-alert i{font-size:0.78rem}@keyframes pulse-amber{0%,100%{box-shadow:0 0 0 0 rgba(249,115,22,0)}50%{box-shadow:0 0 0 5px rgba(249,115,22,0.12)}}.conn-filter-card{padding:14px 18px!important;border-radius:14px!important;margin-bottom:0!important}.conn-filter-row{display:flex;flex-wrap:wrap;gap:8px}.conn-pill{display:inline-flex;align-items:center;gap:6px;padding:7px 16px;background:var(--bg);border:1px solid var(--border);border-radius:99px;font-size:0.85rem;font-weight:600;color:var(--gray);cursor:pointer;transition:all 0.18s;white-space:nowrap}.conn-pill:hover{border-color:var(--primary);color:var(--primary);background:rgba(16,131,254,0.05)}.conn-pill.active{background:var(--primary);border-color:var(--primary);color:#fff}.conn-pill i{font-size:0.8rem}.conn-pill-count{background:#f97316;color:#fff;font-size:0.7rem;font-weight:800;padding:1px 6px;border-radius:99px;line-height:1.5}.conn-pill.active .conn-pill-count{background:rgba(255,255,255,0.28)}.conn-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(285px,1fr));gap:16px}.conn-skeleton{border-radius:14px!important;padding:18px!important;display:flex;flex-direction:column;gap:11px}.conn-skel-top{display:flex;gap:12px;align-items:center}.conn-skel-avatar{width:52px;height:52px;border-radius:50%;flex-shrink:0}.conn-skel-lines{flex:1;display:flex;flex-direction:column;gap:6px}.conn-skel-line{height:11px;border-radius:6px}.conn-skel-line.w40{width:40%}.conn-skel-line.w65{width:65%}.conn-skel-line.w70{width:70%}.conn-skel-line.w90{width:90%}.conn-skel-btns{display:flex;gap:8px;margin-top:4px}.conn-skel-btn{flex:1;height:36px;border-radius:99px}@keyframes shimmer{0%{background-position:-400px 0}100%{background-position:400px 0}}.conn-skel-avatar,.conn-skel-line,.conn-skel-btn{background:linear-gradient(90deg,#e2e8f0 25%,#f1f5f9 50%,#e2e8f0 75%);background-size:400px 100%;animation:shimmer 1.4s infinite}.conn-card{border-radius:14px;padding:18px;background:var(--white);border:1px solid var(--border);display:flex;flex-direction:column;gap:12px;transition:transform 0.18s ease,box-shadow 0.18s ease;animation:connFadeIn 0.28s ease both}.conn-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,0.08)}.conn-card.is-pending{border-left:4px solid #f97316;border-color:#fed7aa}.conn-card.is-pending:hover{box-shadow:0 6px 20px rgba(249,115,22,0.1)}.conn-pending-tag{display:inline-flex;align-items:center;gap:5px;font-size:0.7rem;font-weight:800;text-transform:uppercase;letter-spacing:0.5px;color:#c2410c;background:#fff7ed;padding:3px 9px;border-radius:99px;align-self:flex-start}.conn-card-head{display:flex;align-items:flex-start;gap:12px}.conn-avatar{width:52px;height:52px;border-radius:50%;object-fit:cover;border:2px solid var(--border);flex-shrink:0;display:block;transition:border-color 0.2s}.conn-avatar:hover{border-color:var(--primary)}.conn-identity{flex:1;min-width:0}.conn-name{font-weight:800;font-size:0.97rem;color:var(--dark);text-decoration:none;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3;transition:color 0.15s}.conn-name:hover{color:var(--primary)}.conn-handle{font-size:0.8rem;color:var(--gray);display:block;margin-top:1px}.conn-since{font-size:0.73rem;color:var(--gray);margin-top:5px;display:flex;align-items:center;gap:4px}.conn-since .fa-circle-check{color:#10b981}.conn-since .fa-paper-plane{color:#f97316}.conn-bio{font-size:0.84rem;color:#64748b;line-height:1.55;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.conn-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.conn-cat{display:inline-flex;align-items:center;background:rgba(16,131,254,0.08);color:var(--primary);font-size:0.72rem;font-weight:700;padding:3px 10px;border-radius:20px;text-decoration:none;transition:background 0.15s}.conn-cat:hover{background:rgba(16,131,254,0.15)}.conn-karma{font-size:0.75rem;font-weight:600;color:var(--gray);display:inline-flex;align-items:center;gap:3px}.conn-karma i{color:#f59e0b;font-size:0.68rem}.conn-actions{display:flex;gap:8px;margin-top:auto}.conn-btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:9px 10px;border-radius:99px;font-size:0.82rem;font-weight:700;cursor:pointer;transition:all 0.18s;text-decoration:none;border:1px solid transparent;white-space:nowrap;line-height:1}.conn-btn i{font-size:0.76rem}.conn-btn-view{background:var(--bg);border-color:var(--border);color:var(--dark)}.conn-btn-view:hover{border-color:var(--primary);color:var(--primary);background:rgba(16,131,254,0.04)}.conn-btn-message{background:var(--primary);border-color:var(--primary);color:#fff}.conn-btn-message:hover{background:#0e74e6;border-color:#0e74e6;transform:translateY(-1px);box-shadow:0 4px 12px rgba(16,131,254,0.28)}.conn-btn-accept{background:#16a34a;border-color:#16a34a;color:#fff;flex:2}.conn-btn-accept:hover{background:#15803d;border-color:#15803d;transform:translateY(-1px);box-shadow:0 4px 12px rgba(22,163,74,0.3)}.conn-btn-ignore{background:var(--bg);border-color:var(--border);color:var(--gray)}.conn-btn-ignore:hover{border-color:#ef4444;color:#ef4444;background:#fef2f2}.conn-btn-disconnect{flex:0;padding:9px 12px;background:var(--bg);border-color:var(--border);color:var(--gray)}.conn-btn-disconnect:hover{border-color:#ef4444;color:#ef4444;background:#fef2f2}.conn-empty{grid-column:1 / -1;text-align:center;padding:60px 20px;color:var(--gray)}.conn-empty i{font-size:2.5rem;opacity:0.22;display:block;margin-bottom:16px}.conn-empty p{font-size:1rem;font-weight:700;color:var(--dark);margin:0 0 6px}.conn-empty span{font-size:0.86rem}@keyframes connFadeIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}@media (max-width:600px){.conn-grid{grid-template-columns:1fr}.conn-page-header{flex-direction:column;align-items:flex-start}}