refactor(frontend): storage panel answers in place instead of toasts, empty groups hidden, weight bar animates by transform

frontend/src/lib/components/disk/StorageRow.svelte

@@ -42,7 +42,7 @@
 
   const MIN_WEIGHT = 0.02;
 
-  const width = $derived(`${Math.max(MIN_WEIGHT, Math.min(1, weight)) * 100}%`);
+  const scale = $derived(Math.max(MIN_WEIGHT, Math.min(1, weight)));
 </script>
 
 <div
@@ -81,7 +81,7 @@
           {/if}
         </span>
         <span class="size">{formatBytes(size)}</span>
-        <span class="weight"><span style:width></span></span>
+        <span class="weight"><span style:--scale={scale}></span></span>
       </button>
     {/snippet}
   </ContextMenu>
@@ -237,6 +237,9 @@
     background-color: rgba(var(--color-text-secondary-rgb), 0.16);
 
     span {
+      transform: scaleX(var(--scale));
+      transform-origin: 0 50%;
+
       display: block;
 
       height: 100%;
@@ -244,7 +247,7 @@
 
       background-color: var(--group);
 
-      transition: width 0.3s cubic-bezier(0.16, 1, 0.3, 1);
+      transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
     }
   }
 </style>