.friends-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px;display:flex}.friends-tally{color:var(--bone-2);margin:0}.friends-page{gap:14px;margin-top:28px;display:grid}.friends-intro{color:var(--bone-2);margin:0;font-size:16px}.friends-collection{border:1px solid var(--bone-4);grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px 16px;padding:12px 14px;display:grid}.friends-actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:8px;display:flex}.friends-art{display:inline-flex}.friends-art .btn[aria-pressed=true]{color:var(--bone);box-shadow:inset 0 -2px 0 var(--bone)}.friends-art .btn[aria-pressed=false]{color:var(--bone-3)}.friends-legend{color:var(--bone-2);flex-wrap:wrap;gap:6px 18px;margin:0;padding:0;list-style:none;display:flex}.friends-legend li{align-items:center;gap:7px;display:inline-flex}.friends-legend i{border:2px solid var(--tone,var(--bone-3));width:10px;height:10px}.friends-legend [data-tone=grey] i{border-width:1px;border-color:var(--bone-4)}.friends-legend [data-tone=held] i{border-width:1px;border-color:var(--bone-2)}.friends-collection>p.dim{margin:0;font-size:13px;line-height:1.5}.friends-note{min-height:1.4em;color:var(--bone-2);grid-column:1/-1;margin:0}.friends-grid{grid-template-columns:repeat(auto-fill,minmax(min(150px,100%),1fr));gap:10px;margin:0;padding:0;list-style:none;display:grid}.friend{border:1px solid var(--bone-4);background:var(--ink);width:100%;color:inherit;font:inherit;text-align:left;cursor:pointer;gap:6px;padding:8px 8px 10px;display:grid}.friend:hover,.friend:focus-visible{border-color:var(--bone-2);outline:none}.friend-portrait{aspect-ratio:4/5;background:var(--ink);width:100%;display:block;overflow:hidden}.friend-portrait canvas{height:auto;display:block;width:100%!important}.friend[data-state=grey] .friend-portrait canvas,.friend-portrait-lg[data-state=grey] canvas{opacity:.28}.friend[data-state=grey] .friend-name{color:var(--bone-3)}[data-tone=wall]{--tone:var(--framed)}[data-tone=called]{--tone:var(--called)}[data-tone=maxed]{--tone:var(--signal)}.friend[data-tone=held]{border-color:var(--bone-3)}.friend[data-tone=wall],.friend[data-tone=called],.friend[data-tone=maxed]{border-color:var(--tone);box-shadow:inset 0 0 0 1px var(--tone)}.friend[data-tone] .friend-meta{color:var(--tone,var(--bone-3))}.friend[data-state=quiet]{box-shadow:none;border-style:dashed}.friend-name{font-size:16px;line-height:1.15}.friend-meta{min-height:1.3em}.friend-pips{flex-wrap:wrap;gap:2px;min-height:6px;display:flex}.friend-pips i{border:1px solid var(--bone-4);width:6px;height:6px}.friend-pips i.on{background:var(--signal);border-color:var(--signal)}.friend-sheet .friend-portrait-lg{justify-self:center;width:min(240px,100%)}.friend-sheet .sheet-body .btn{justify-self:start}.friend-portrait-lg[data-tone=wall],.friend-portrait-lg[data-tone=called],.friend-portrait-lg[data-tone=maxed]{outline:2px solid var(--tone);outline-offset:4px}.friend-keepsake{border:1px solid var(--bone-4);grid-template-columns:112px minmax(0,1fr);align-items:start;gap:12px;padding:10px 12px;display:grid}.keepsake-art{background:var(--ink);width:112px;height:112px;display:block;overflow:hidden}.keepsake-art canvas{height:auto;display:block;width:100%!important}.friend-keepsake-text{gap:4px;min-width:0;display:grid}.friend-keepsake p{margin:0}.friend-keepsake .serif{font-size:15px;line-height:1.4}.friend-does{color:var(--signal)}.friend-status{justify-items:start;gap:8px;display:grid}.friend-status p{color:var(--bone-2);margin:0;font-size:13.5px;line-height:1.5}@media (max-width:560px){.friends-collection{grid-template-columns:minmax(0,1fr)}.friends-actions{justify-content:flex-start}.friend-keepsake{grid-template-columns:80px minmax(0,1fr)}.keepsake-art{width:80px;height:80px}}