refactor(ui): mint the text-2xs token and the neutral TagChip

Three integration cards carried the same hand-copied chip literal in the
card-header accessory slot, each free to drift on the next touch; the size
itself was an arbitrary value repeated at three slightly different spellings
across the tree.

- Mint `--text-2xs` (0.6875rem with a matched line-height) as the one
  sanctioned step below `text-xs`.
- Mint `TagChip` and adopt it on the Fitbit, Google Health, and Nightscout
  cards. It stays distinct from `Badge`, which carries status meaning.
- Sweep the arbitrary micro sizes: the stepper label and the two dose-ledger
  outline badges move onto the token; the muted target caption and the muted
  ledger meta row move up to the `text-xs` muted floor.

No visible change beyond the two muted rows gaining a fraction of a pixel.

src/components/settings/integrations/fitbit-card.tsx

@@ -36,6 +36,7 @@ import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { PasswordInput } from "@/components/ui/password-input";
+import { TagChip } from "@/components/ui/tag-chip";
 import { SettingsCard } from "@/components/settings/settings-card";
 import { SettingsCardHeader } from "@/components/settings/_card-header";
 import { IntegrationStatusPill } from "@/components/settings/integration-status-pill";
@@ -204,9 +205,7 @@ export function FitbitCard({
         title={t("settings.fitbit")}
         titleAccessory={
           <>
-            <span className="bg-muted text-foreground rounded-full px-2 py-0.5 text-[0.6875rem] font-medium">
-              {t("settings.fitbitTag")}
-            </span>
+            <TagChip>{t("settings.fitbitTag")}</TagChip>
             <Badge
               variant="outline"
               data-testid="fitbit-experimental-badge"

src/components/settings/integrations/google-health-card.tsx

@@ -44,6 +44,7 @@ import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { PasswordInput } from "@/components/ui/password-input";
+import { TagChip } from "@/components/ui/tag-chip";
 import { SettingsCard } from "@/components/settings/settings-card";
 import { SettingsCardHeader } from "@/components/settings/_card-header";
 import { IntegrationStatusPill } from "@/components/settings/integration-status-pill";
@@ -212,9 +213,7 @@ export function GoogleHealthCard({
         title={t("settings.googleHealth")}
         titleAccessory={
           <>
-            <span className="bg-muted text-foreground rounded-full px-2 py-0.5 text-[0.6875rem] font-medium">
-              {t("settings.googleHealthTag")}
-            </span>
+            <TagChip>{t("settings.googleHealthTag")}</TagChip>
             <Badge
               variant="outline"
               data-testid="google-health-beta-badge"

src/components/settings/integrations/nightscout-card.tsx

@@ -37,6 +37,7 @@ import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { PasswordInput } from "@/components/ui/password-input";
 import { Switch } from "@/components/ui/switch";
+import { TagChip } from "@/components/ui/tag-chip";
 import { SettingsCard } from "@/components/settings/settings-card";
 import { SettingsCardHeader } from "@/components/settings/_card-header";
 import { IntegrationStatusPill } from "@/components/settings/integration-status-pill";
@@ -186,11 +187,7 @@ export function NightscoutCard({
       <SettingsCardHeader
         icon={Droplet}
         title={t("settings.nightscout")}
-        titleAccessory={
-          <span className="bg-muted text-foreground rounded-full px-2 py-0.5 text-[0.6875rem] font-medium">
-            {t("settings.nightscoutTag")}
-          </span>
-        }
+        titleAccessory={<TagChip>{t("settings.nightscoutTag")}</TagChip>}
         description={
           <IntegrationCardDescription
             i18nPrefix="settings.nightscout"