.friend-avatar{object-fit:cover;background:color-mix(in srgb, var(--fg) 6%, transparent);border:1px solid color-mix(in srgb, var(--fg) 10%, transparent);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.friend-avatar--fallback{letter-spacing:.02em;color:var(--fg-muted);background:color-mix(in srgb, var(--accent) 14%, transparent);border-color:color-mix(in srgb, var(--accent) 24%, transparent);-webkit-user-select:none;user-select:none;font-weight:600}.friend-avatar--sm{width:28px;height:28px;font-size:.6875rem}.friend-avatar--md{width:44px;height:44px;font-size:.9375rem}.friend-avatar--lg{width:64px;height:64px;font-size:1.25rem}.friend-avatar--xl{width:84px;height:84px;font-size:1.625rem}@media (max-width:640px){.friend-avatar--xl{width:64px;height:64px;font-size:1.25rem}}
.relationship-button{white-space:nowrap;cursor:pointer;border:1px solid #0000;border-radius:8px;justify-content:center;align-items:center;gap:.375rem;font-family:inherit;font-weight:600;text-decoration:none;transition:background .15s,border-color .15s,color .15s,opacity .15s;display:inline-flex}.relationship-button--md{padding:.5rem 1rem;font-size:.875rem}.relationship-button--sm{padding:.375rem .75rem;font-size:.8125rem}.relationship-button--primary{background:var(--accent);color:var(--accent-fg);border-color:color-mix(in srgb, var(--fg) 12%, transparent)}.relationship-button--primary:hover:not(:disabled){background:var(--accent-dark)}.relationship-button--secondary{background:color-mix(in srgb, var(--fg) 6%, transparent);color:var(--fg);border-color:color-mix(in srgb, var(--fg) 14%, transparent)}.relationship-button--secondary:hover:not(:disabled){background:color-mix(in srgb, var(--fg) 10%, transparent);border-color:color-mix(in srgb, var(--fg) 22%, transparent)}.relationship-button--danger{color:var(--fg-muted);border-color:color-mix(in srgb, var(--fg) 14%, transparent);background:0 0}.relationship-button--danger:hover:not(:disabled){color:#ef4444;background:#ef44441a;border-color:#ef44444d}.relationship-button:disabled{opacity:.6;cursor:default}.relationship-button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.relationship-button__wrap{flex-direction:column;align-items:flex-start;gap:.5rem;display:flex}.relationship-button__row{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.relationship-button__error{color:#ef4444;margin:0;font-size:.8125rem}