From 69e3924aaf3ea72b6c184d11446648e9719d1825 Mon Sep 17 00:00:00 2001
From: David Hill <iamdavidhill@gmail.com>
Date: Thu, 12 Mar 2026 17:13:39 +0000
Subject: [PATCH] tui: fix status indicator positioning for better visual
 alignment

---
 packages/app/src/components/status-popover.tsx | 2 +-
 packages/ui/src/styles/tailwind/utilities.css  | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/app/src/components/status-popover.tsx b/packages/app/src/components/status-popover.tsx
index ea97bf4bca..2c3d91c54d 100644
--- a/packages/app/src/components/status-popover.tsx
+++ b/packages/app/src/components/status-popover.tsx
@@ -217,7 +217,7 @@ export function StatusPopover() {
           </div>
           <div
             classList={{
-              "absolute top-0 -right-px size-1.5 rounded-full": true,
+              "absolute -top-px -right-px size-1.5 rounded-full": true,
               "bg-icon-success-base": overallHealthy(),
               "bg-icon-critical-base": !overallHealthy() && server.healthy() !== undefined,
               "bg-border-weak-base": server.healthy() === undefined,
diff --git a/packages/ui/src/styles/tailwind/utilities.css b/packages/ui/src/styles/tailwind/utilities.css
index 79c19ade97..2ba9199dbf 100644
--- a/packages/ui/src/styles/tailwind/utilities.css
+++ b/packages/ui/src/styles/tailwind/utilities.css
@@ -14,8 +14,8 @@
 }
 
 @utility badge-mask-tight {
-  -webkit-mask-image: radial-gradient(circle 5px at calc(100% - 2px) 3px, transparent 5px, black 5.5px);
-  mask-image: radial-gradient(circle 5px at calc(100% - 2px) 3px, transparent 5px, black 5.5px);
+  -webkit-mask-image: radial-gradient(circle 5px at calc(100% - 2px) 2px, transparent 5px, black 5.5px);
+  mask-image: radial-gradient(circle 5px at calc(100% - 2px) 2px, transparent 5px, black 5.5px);
 }
 
 @utility truncate-start {