Hold wheel position after spin instead of snapping back

lib/mtg_wheel_web/live/wheel_live.ex

@@ -79,7 +79,7 @@ defmodule MtgWheelWeb.WheelLive do
       <div class="relative w-28 h-28 rounded-full border-4 border-purple-600 overflow-hidden bg-gray-900 shadow-lg shadow-purple-950">
         <div
           class={["wheel-inner absolute top-0 left-0 right-0 flex flex-col items-center", @spinning && "spinning"]}
-          style={wheel_style(@items, @result, @duration)}
+          style={wheel_style(@items, @result, @duration, @spinning)}
         >
           <%= for _ <- 1..5 do %>
             <%= for item <- @items do %>
@@ -106,11 +106,16 @@ defmodule MtgWheelWeb.WheelLive do
     """
   end
 
-  defp wheel_style(items, result, duration_ms) do
+  defp wheel_style(items, result, duration_ms, spinning) do
     n = length(items)
     idx = if result, do: Enum.find_index(items, &(&1 == result)) || 0, else: 0
     end_px = -(3 * n + idx) * @item_height_px
-    "--wheel-end: #{end_px}px; --wheel-duration: #{duration_ms}ms"
+
+    if spinning do
+      "--wheel-end: #{end_px}px; --wheel-duration: #{duration_ms}ms"
+    else
+      if result, do: "transform: translateY(#{end_px}px)", else: ""
+    end
   end
 
   defp color_icons(assigns) do