From c40f4657081a10bf79205cb535d225d0320b74c6 Mon Sep 17 00:00:00 2001
From: Dmitriy Petrov <floplopru@gmail.com>
Date: Sun, 12 Jul 2026 12:42:35 +0300
Subject: [PATCH] Bump Harbor versions and refine mode swap animation

---
 src/shared/versions.js |  4 ++--
 src/web/styles.css     | 17 ++++++++++++-----
 2 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/src/shared/versions.js b/src/shared/versions.js
index 7f167a2..0d0be6f 100644
--- a/src/shared/versions.js
+++ b/src/shared/versions.js
@@ -1,6 +1,6 @@
 export const HARBOR_VERSIONS = Object.freeze({
-  macClient: '0.7.5',
-  gatewayClient: '0.7.5',
+  macClient: '0.7.6',
+  gatewayClient: '0.7.6',
   gatewayBackend: '0.7.0',
 });
 
diff --git a/src/web/styles.css b/src/web/styles.css
index f5d4e08..6e70d90 100644
--- a/src/web/styles.css
+++ b/src/web/styles.css
@@ -559,12 +559,13 @@ p {
 .harbor-mode-swap path {
   transform-box: fill-box;
   transform-origin: center;
-  transition: transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
+  transition: opacity 420ms ease, filter 420ms ease, transform 560ms cubic-bezier(0.16, 1, 0.3, 1);
 }
 
 .harbor-mode-swap .is-connect {
+  opacity: 1;
   stroke: var(--harbor-connect);
-  transition: transform 560ms cubic-bezier(0.16, 1, 0.3, 1);
+  transition: opacity 420ms ease, filter 420ms ease, transform 560ms cubic-bezier(0.16, 1, 0.3, 1);
 }
 
 .harbor-mode-swap .is-connect path {
@@ -572,8 +573,10 @@ p {
 }
 
 .harbor-mode-swap .is-gateway {
+  opacity: 0.28;
+  filter: blur(0.45px);
   stroke: var(--harbor-gateway);
-  transition: transform 560ms cubic-bezier(0.16, 1, 0.3, 1);
+  transition: opacity 420ms ease, filter 420ms ease, transform 560ms cubic-bezier(0.16, 1, 0.3, 1);
 }
 
 .harbor-mode-swap .is-gateway path {
@@ -581,11 +584,15 @@ p {
 }
 
 .harbor-brand.is-gateway-active .harbor-mode-swap .is-connect {
-  transform: translateY(6px);
+  opacity: 0.28;
+  filter: blur(0.45px);
+  transform: translateY(6px) rotate(180deg);
 }
 
 .harbor-brand.is-gateway-active .harbor-mode-swap .is-gateway {
-  transform: translateY(-6px);
+  opacity: 1;
+  filter: none;
+  transform: translateY(-6px) rotate(180deg);
 }
 
 .harbor-mode-tooltip {