feat: smooth sortable row interactions

backend/bot/app/web/themes/ascii/style.css

@@ -353,6 +353,8 @@
 }
 
 .theme-key-ascii .ui-sortable {
+  --sortable-drop-line: #ffffff;
+  --sortable-drop-soft: rgba(255, 255, 255, 0.08);
   gap: 6px;
 }
 
@@ -364,6 +366,15 @@
   outline: 1px dashed #ffffff;
   outline-offset: 2px;
   background: rgba(255, 255, 255, 0.08);
+  box-shadow: none;
+}
+
+.theme-key-ascii .ui-sortable-item.is-drop-target::before {
+  top: -5px;
+  height: 1px;
+  border-radius: 0;
+  background: #ffffff;
+  box-shadow: none;
 }
 
 .theme-key-ascii .ui-sortable-handle {

backend/bot/app/web/themes/light/style.css

@@ -236,9 +236,20 @@ body:has(.theme-key-light) .install-platform-item[data-selected] {
   color: color-mix(in srgb, var(--accent) 58%, #0f172a);
 }
 
+.theme-key-light .ui-sortable {
+  --sortable-drop-line: color-mix(in srgb, var(--accent) 64%, #0f172a);
+}
+
 .theme-key-light .ui-sortable-item.is-drop-target {
-  outline-color: color-mix(in srgb, var(--accent) 48%, #0f172a);
   background: color-mix(in srgb, var(--accent) 8%, #ffffff);
+  box-shadow:
+    inset 0 0 0 1px color-mix(in srgb, var(--accent) 26%, transparent),
+    0 10px 22px color-mix(in srgb, var(--accent) 7%, transparent);
+}
+
+.theme-key-light .ui-sortable-item.is-drop-target::before {
+  background: var(--sortable-drop-line);
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 14%, transparent);
 }
 
 /* Telegram notifications banner: keep the warm warning tint but swap the

backend/bot/app/web/themes/windows95/style.css

@@ -1231,6 +1231,16 @@ body:has(.theme-key-windows95) .install-platform-item[data-selected] {
   background: color-mix(in srgb, var(--accent) 12%, var(--admin-surface));
 }
 
+.theme-key-windows95 .ui-sortable-item.is-drop-target::before {
+  top: -7px;
+  height: 2px;
+  border-radius: 0;
+  background: #000080;
+  box-shadow:
+    0 1px 0 #ffffff,
+    0 -1px 0 #000000;
+}
+
 .theme-key-windows95 .ui-sortable-handle {
   align-self: center;
   width: 24px;