style: different borders for Following and Mutuals

components/account/AccountFollowButton.vue

@@ -39,7 +39,7 @@ useCommand({
     gap-1 items-center group
     :disabled="relationship?.requested"
     border-1
-    rounded-full flex="~ gap2 center" font-500 w-30 h-fit py1 :class="relationship?.following ? 'text-base border-text-base' : 'text-inverted bg-primary border-primary'" :hover="relationship?.following ? 'border-red text-red' : 'bg-base border-primary text-primary'" @click="toggleFollow"
+    rounded-full flex="~ gap2 center" font-500 w-30 h-fit py1 :class="relationship?.following ? (`text-base ${relationship?.followedBy ? 'border-strong' : 'border-base'}`) : 'text-inverted bg-primary border-primary'" :hover="relationship?.following ? 'border-red text-red' : 'bg-base border-primary text-primary'" @click="toggleFollow"
   >
     <template v-if="relationship?.following">
       <span group-hover="hidden">{{ relationship?.followedBy ? $t('account.mutuals') : $t('account.following') }}</span>

unocss.config.ts

@@ -13,6 +13,7 @@ export default defineConfig({
   shortcuts: [
     {
       'border-base': 'border-$c-border',
+      'border-strong': 'border-$c-text-base',
       'border-bg-base': 'border-$c-bg-base',
 
       // background