.com-wrap{ max-width:1100px; margin:0 auto; padding:8px 16px 40px; }
.com-search, .com-search *{ box-sizing:border-box; }
.com-search{ display:flex !important; flex-wrap:nowrap; gap:8px; max-width:480px; margin-bottom:10px; }
.com-input-wrap{ position:relative; flex:1 1 auto; min-width:0; }
.com-input-wrap input{ width:100%; height:40px; padding:0 12px; border:1px solid rgba(0,112,187,.25); border-radius:8px; font-size:.88rem; background:#fff; color:#333; outline:none; }
.com-input-wrap input:focus{ border-color:#2563eb; box-shadow:0 0 0 2px rgba(37,99,235,.15); }
.com-search button{ flex:0 0 auto; padding:0 18px; height:40px; background:#2563eb; color:#fff; border:none; border-radius:8px; cursor:pointer; font-weight:600; font-size:.85rem; }
.com-search button:hover{ background:#1d4ed8; }
.com-sug{ position:absolute; top:calc(100% + 4px); left:0; right:0; background:#fff; border:1px solid #e5e7eb; border-radius:10px; box-shadow:0 8px 24px rgba(0,0,0,.13); z-index:60; max-height:320px; overflow-y:auto; display:none; }
.com-sug-item{ display:flex; gap:10px; align-items:center; padding:8px 10px; cursor:pointer; }
.com-sug-item:hover{ background:#f3f4f6; }
.com-sug-av{ width:34px; height:34px; border-radius:50%; object-fit:cover; background:#e5e7eb; flex:none; }
.com-sug-ph{ display:flex; align-items:center; justify-content:center; color:#9ca3af; font-size:.85rem; }
.com-sug-col{ min-width:0; }
.com-sug-n{ font-size:.85rem; font-weight:600; color:#111827; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.com-sug-u{ font-size:.75rem; color:#6b7280; }
.com-sug-empty{ padding:10px 12px; font-size:.82rem; color:#6b7280; }
.com-count{ font-size:.8rem; color:#6b7280; margin-bottom:14px; }
.com-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:16px; }
.com-card{ background:#fff; border:1px solid #e5e7eb; border-radius:14px; padding:18px 14px 14px; text-align:center; box-shadow:0 2px 8px rgba(0,0,0,.04); display:flex; flex-direction:column; gap:6px; transition:box-shadow .15s, transform .15s; }
.com-card:hover{ box-shadow:0 6px 18px rgba(0,0,0,.09); transform:translateY(-2px); }
.com-link{ text-decoration:none; color:inherit; display:block; }
.com-avatar{ width:72px; height:72px; border-radius:50%; object-fit:cover; border:3px solid #fff; box-shadow:0 2px 8px rgba(0,0,0,.12); background:#e5e7eb; }
.com-avatar-ph{ display:flex; align-items:center; justify-content:center; color:#9ca3af; font-size:1.6rem; margin:0 auto; }
.com-nombre{ font-weight:700; color:#111827; font-size:.95rem; margin-top:8px; }
.com-link:hover .com-nombre{ color:#2563eb; }
.com-user{ color:#6b7280; font-size:.78rem; }
.com-ocup{ font-size:.75rem; color:#2563eb; font-weight:600; }
.com-bio{ font-size:.78rem; color:#4b5563; line-height:1.4; min-height:2.2em; overflow:hidden; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; }
.com-stats{ display:flex; justify-content:center; gap:14px; font-size:.72rem; color:#6b7280; margin-top:2px; }
.com-stats b{ color:#111827; }
.com-seguir{ margin-top:4px; padding:0 14px; border-radius:8px; border:1px solid #2563eb; background:#2563eb; color:#fff; font-size:.78rem; font-weight:600; cursor:pointer; transition:all .15s; }
.com-seguir:hover{ background:#1d4ed8; }
.com-seguir.siguiendo{ background:#f3f4f6; color:#374151; border-color:#d1d5db; }
.com-seguir:disabled{ opacity:.6; cursor:default; }
.com-tu{ font-size:.75rem; color:#059669; font-weight:700; }
.com-vacio{ text-align:center; color:#6b7280; padding:40px 10px; font-size:.9rem; }
.com-pager{ display:flex; align-items:center; justify-content:center; gap:12px; margin-top:26px; }
.com-pg{ padding:8px 14px; border:1px solid rgba(0,112,187,.3); border-radius:8px; text-decoration:none; color:#2563eb; font-size:.82rem; background:#fff; cursor:pointer; }
.com-pg:hover{ background:rgba(0,112,187,.08); }
.com-pg.active{ background:#2563eb; color:#fff; border-color:#2563eb; }
.com-pg.active:hover{ background:#1d4ed8; }
.com-pg.off{ opacity:.4; pointer-events:none; }
.com-pg-info{ font-size:.8rem; color:#6b7280; }
.com-mas-wrap{ display:flex; justify-content:center; margin-top:26px; }
.com-mas{ padding:9px 26px; border:1px solid rgba(0,112,187,.3); background:#fff; color:#2563eb; border-radius:8px; font-size:.85rem; font-weight:600; cursor:pointer; }
.com-mas:hover{ background:rgba(0,112,187,.08); }
.com-mas:disabled{ opacity:.6; cursor:default; }