From 669126250e7a62d8c32b212c64e8a4f8f373599e Mon Sep 17 00:00:00 2001
From: Alexander Zaytsev <nqst@users.noreply.github.com>
Date: Tue, 27 Jan 2026 18:38:10 +0100
Subject: [PATCH 1/5] Remove `filter` from transition properties to fix
 glitches in Safari

---
 app/assets/stylesheets/base.css    | 2 +-
 app/assets/stylesheets/buttons.css | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/assets/stylesheets/base.css b/app/assets/stylesheets/base.css
index 689b80215..0c76ee544 100644
--- a/app/assets/stylesheets/base.css
+++ b/app/assets/stylesheets/base.css
@@ -34,7 +34,7 @@
 
   :is(a, button, input, textarea, .switch, .btn) {
     transition: 100ms ease-out;
-    transition-property: background-color, border-color, box-shadow, filter, outline;
+    transition-property: background-color, border-color, box-shadow, outline;
     touch-action: manipulation;
 
     /* Keyboard navigation */
diff --git a/app/assets/stylesheets/buttons.css b/app/assets/stylesheets/buttons.css
index ac897184f..a1419db16 100644
--- a/app/assets/stylesheets/buttons.css
+++ b/app/assets/stylesheets/buttons.css
@@ -19,7 +19,7 @@
     pointer-events: auto;
     position: relative;
     transition: 100ms ease-out;
-    transition-property: background-color, border, box-shadow, color, filter, opacity, scale;
+    transition-property: background-color, border, box-shadow, color, opacity, scale;
 
     @media (any-hover: hover) {
       &:hover {

From 9b05c9b4f9568e88fa6ce91f3a11080d0b163a41 Mon Sep 17 00:00:00 2001
From: Alexander Zaytsev <nqst@users.noreply.github.com>
Date: Tue, 27 Jan 2026 19:01:33 +0100
Subject: [PATCH 2/5] Fix card column glitches

---
 app/assets/stylesheets/card-columns.css | 1 +
 1 file changed, 1 insertion(+)

diff --git a/app/assets/stylesheets/card-columns.css b/app/assets/stylesheets/card-columns.css
index 1083c2ffc..6b018d5c9 100644
--- a/app/assets/stylesheets/card-columns.css
+++ b/app/assets/stylesheets/card-columns.css
@@ -403,6 +403,7 @@
     outline-offset: -2px;
     position: relative;
     text-transform: uppercase;
+    will-change: transform;
 
     &[disabled] {
       opacity: 1;

From 62e8bb67adb7622cb478a7be570a73770021dcf0 Mon Sep 17 00:00:00 2001
From: Alexander Zaytsev <nqst@users.noreply.github.com>
Date: Wed, 28 Jan 2026 10:04:14 +0100
Subject: [PATCH 3/5] Fix blurry card columns

---
 app/assets/stylesheets/card-columns.css | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/app/assets/stylesheets/card-columns.css b/app/assets/stylesheets/card-columns.css
index 6b018d5c9..d68e41566 100644
--- a/app/assets/stylesheets/card-columns.css
+++ b/app/assets/stylesheets/card-columns.css
@@ -185,15 +185,16 @@
   .cards__transition-container {
     block-size: 100%;
     border-radius: calc(var(--column-width-collapsed) / 2);
-    translate: 0 0.5ch; /* Allow a little room for the mini bubble */
+    margin-block-start: 0.5ch; /* Allow a little room for the mini bubble */
     transition: translate var(--column-transition-duration) var(--ease-out-overshoot-subtle);
 
     @media (min-width: 640px) {
       .is-expanded & {
-        translate: 0 0.5ch; /* Allow a little room for the mini bubble */
+        translate: 0; /* Reset when back from collapsed */
       }
 
       .is-collapsed & {
+        margin-block-start: 0;
         translate: 0 var(--column-width-collapsed);
       }
     }

From c15d7ae99523f8d73d9509cdb1959f861c5603a8 Mon Sep 17 00:00:00 2001
From: Alexander Zaytsev <nqst@users.noreply.github.com>
Date: Wed, 28 Jan 2026 10:31:56 +0100
Subject: [PATCH 4/5] Cleanup

---
 app/assets/stylesheets/card-columns.css | 1 -
 1 file changed, 1 deletion(-)

diff --git a/app/assets/stylesheets/card-columns.css b/app/assets/stylesheets/card-columns.css
index d68e41566..cfb6704c0 100644
--- a/app/assets/stylesheets/card-columns.css
+++ b/app/assets/stylesheets/card-columns.css
@@ -404,7 +404,6 @@
     outline-offset: -2px;
     position: relative;
     text-transform: uppercase;
-    will-change: transform;
 
     &[disabled] {
       opacity: 1;

From 7cda948a6e7d6d48b0ab45d8a527aee6f2ede82c Mon Sep 17 00:00:00 2001
From: Alexander Zaytsev <nqst@users.noreply.github.com>
Date: Wed, 28 Jan 2026 10:36:24 +0100
Subject: [PATCH 5/5] Update comment

---
 app/assets/stylesheets/card-columns.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/card-columns.css b/app/assets/stylesheets/card-columns.css
index cfb6704c0..9eb62ec51 100644
--- a/app/assets/stylesheets/card-columns.css
+++ b/app/assets/stylesheets/card-columns.css
@@ -190,7 +190,7 @@
 
     @media (min-width: 640px) {
       .is-expanded & {
-        translate: 0; /* Reset when back from collapsed */
+        translate: 0; /* Animate back from collapsed state */
       }
 
       .is-collapsed & {