.friends.svelte-cfnpsi{display:flex;flex-direction:column;gap:1rem}.friends.svelte-cfnpsi>main:where(.svelte-cfnpsi){display:grid;grid-template-columns:1fr 1fr;gap:1rem}@media screen and (max-width:768px){.friends.svelte-cfnpsi>main:where(.svelte-cfnpsi){grid-template-columns:1fr}}.friend.svelte-cfnpsi{display:flex;flex-direction:column;gap:.625rem;background-color:var(--base-background);border:2px solid var(--base-accent);padding:1rem;position:relative}.friend.svelte-cfnpsi>.person:where(.svelte-cfnpsi){display:grid;grid-template-columns:max-content 1fr;align-items:center;gap:.75rem;width:100%}.friend.svelte-cfnpsi>.person:where(.svelte-cfnpsi)>img:where(.svelte-cfnpsi){width:3rem;height:3rem}.friend.svelte-cfnpsi>.person:where(.svelte-cfnpsi)>span:where(.svelte-cfnpsi){display:flex;flex-direction:column;line-height:1;gap:0}.friend.svelte-cfnpsi>.person:where(.svelte-cfnpsi) b:where(.svelte-cfnpsi){font-size:1.375rem}.friend.svelte-cfnpsi>.person:where(.svelte-cfnpsi) p:where(.svelte-cfnpsi){font-size:1.125rem;opacity:.5}.friend.svelte-cfnpsi>small:where(.svelte-cfnpsi){position:absolute;right:0;top:0;background-color:var(--base-accent);color:#fff;padding:.25rem .5rem}.friend.svelte-cfnpsi>span:where(.svelte-cfnpsi){font-size:1.125rem;font-style:italic;opacity:.75}.friend.svelte-cfnpsi>.meta:where(.svelte-cfnpsi){display:flex;justify-content:space-between;align-items:center;width:100%;margin-top:auto}.friend.svelte-cfnpsi>.meta:where(.svelte-cfnpsi) .tags:where(.svelte-cfnpsi),.friend.svelte-cfnpsi>.meta:where(.svelte-cfnpsi) .ext-links:where(.svelte-cfnpsi){display:flex;flex-direction:row;align-items:center;gap:.375rem}.friend.svelte-cfnpsi>.meta:where(.svelte-cfnpsi) .tags:where(.svelte-cfnpsi)>span:where(.svelte-cfnpsi){background-color:var(--base-accent);color:#fff;font-size:.875rem;font-weight:600;padding:0 .5rem;display:flex;align-items:center;height:calc(1cap + .875rem)}.friend.svelte-cfnpsi>.meta:where(.svelte-cfnpsi) .ext-links:where(.svelte-cfnpsi)>a:where(.svelte-cfnpsi){display:flex;justify-content:center;align-items:center;position:relative;background-color:var(--base-accent);text-decoration:none;color:#fff;width:1.5rem;height:1.5rem}.friend.svelte-cfnpsi>.meta:where(.svelte-cfnpsi) .ext-links:where(.svelte-cfnpsi)>a:where(.svelte-cfnpsi) b:where(.svelte-cfnpsi){font-size:.625rem;text-align:right;text-shadow:-1px -1px 0 var(--base-accent),-1px 0 0 var(--base-accent),-1px 1px 0 var(--base-accent),0 0 2px var(--base-accent);position:absolute;right:2px;bottom:2px}.sort.svelte-cfnpsi{display:grid;grid-template-columns:max-content 1fr;align-items:center;gap:.75rem;width:100%}.sort.svelte-cfnpsi>b:where(.svelte-cfnpsi){background-color:var(--base-accent);color:#fff;padding:.5rem 1rem}.sort.svelte-cfnpsi>main:where(.svelte-cfnpsi){display:flex;grid-auto-columns:1fr;width:100%;border:2px solid var(--base-accent);background-color:var(--base-background)}.sort.svelte-cfnpsi>main:where(.svelte-cfnpsi) button:where(.svelte-cfnpsi){font:inherit;font-weight:500;background-color:transparent;color:var(--base-accent);border:none;width:100%;padding:calc(.5rem - 2px) calc(1rem - 2px);transition-property:background-color,color;transition-timing-function:cubic-bezier(0,.55,.45,1);transition-duration:.1s}.sort.svelte-cfnpsi>main:where(.svelte-cfnpsi) button:where(.svelte-cfnpsi):hover{background-color:var(--base-surface-off)}.sort.svelte-cfnpsi>main:where(.svelte-cfnpsi) button.active:where(.svelte-cfnpsi){background-color:var(--base-surface-on);color:#fff}@media(prefers-color-scheme:dark){.sort.svelte-cfnpsi>main:where(.svelte-cfnpsi) button:where(.svelte-cfnpsi){color:var(--base-foreground)}}