From 6328989608f3cda2a7eb8e578a4220c55a789333 Mon Sep 17 00:00:00 2001
From: Hermes Agent <hermes@local>
Date: Wed, 16 Sep 2026 14:42:27 +0200
Subject: [PATCH] ui: make resize handles visible on any Figma theme (gray
 border + light fill)

---
 src/ui.tsx | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/ui.tsx b/src/ui.tsx
index 2ca50a1..e48d3de 100644
--- a/src/ui.tsx
+++ b/src/ui.tsx
@@ -287,8 +287,10 @@ function Plugin () {
         .resize-hitbox {
           opacity: 0;
           transition: opacity 120ms ease, background 120ms ease, border-color 120ms ease;
-          background: rgba(255, 255, 255, 0.4);
-          border: 1px solid rgba(255, 255, 255, 0.55);
+          /* Light fill (visible on dark themes) + mid-gray border (visible on light
+             themes) so the handles read on either Figma theme. */
+          background: rgba(255, 255, 255, 0.5);
+          border: 1.5px solid rgba(110, 110, 110, 0.9);
           border-radius: 4px;
         }
         /* Hovering any handle (or anywhere in the window) reveals all handles. */
@@ -296,8 +298,8 @@ function Plugin () {
         .plugin-root:has(.resize-hitbox:hover) .resize-hitbox { opacity: 1; }
         /* The specifically hovered handle is brighter. */
         .resize-hitbox:hover {
-          background: rgba(255, 255, 255, 0.9);
-          border-color: rgba(255, 255, 255, 1);
+          background: rgba(255, 255, 255, 0.95);
+          border-color: rgba(80, 80, 80, 1);
         }
       `}</style>
       <Container space="medium" style={{ height: '100%', display: 'flex', flexDirection: 'column' }}>