From b33821ba82b622c047540d8d3e703c99bd76a8a0 Mon Sep 17 00:00:00 2001
From: pa <maplenagisa@gmail.com>
Date: Tue, 17 Mar 2026 22:13:44 +0900
Subject: [PATCH] adjust friend status icon styles

---
 src/styles/status-icon.css | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/src/styles/status-icon.css b/src/styles/status-icon.css
index 01c7de31..d3647fc1 100644
--- a/src/styles/status-icon.css
+++ b/src/styles/status-icon.css
@@ -11,26 +11,40 @@
     content: '';
     background: var(--status-offline);
     border-radius: 50%;
+    box-shadow: 0 0 0 1px var(--background);
 }
 
 .status-icon.active::after {
     background: var(--status-active);
+    box-shadow: 0 0 0 1px var(--background);
 }
 
 .status-icon.online::after {
     background: var(--status-online);
+    box-shadow:
+        0 0 0 1px var(--background),
+        0 0 4px color-mix(in oklch, var(--status-online) 50%, transparent);
 }
 
 .status-icon.joinme::after {
     background: var(--status-joinme);
+    box-shadow:
+        0 0 0 1px var(--background),
+        0 0 4px color-mix(in oklch, var(--status-joinme) 50%, transparent);
 }
 
 .status-icon.askme::after {
     background: var(--status-askme);
+    box-shadow:
+        0 0 0 1px var(--background),
+        0 0 4px color-mix(in oklch, var(--status-askme) 50%, transparent);
 }
 
 .status-icon.busy::after {
     background: var(--status-busy);
+    box-shadow:
+        0 0 0 1px var(--background),
+        0 0 4px color-mix(in oklch, var(--status-busy) 50%, transparent);
 }
 
 .accessible-status-indicators .status-icon.joinme::after {
@@ -47,6 +61,7 @@
 
 .status-icon.offline::after {
     background: var(--status-offline);
+    box-shadow: 0 0 0 1px var(--background);
 }
 
 .active img,