fix: audio preview sizing issue

webui/src/components/display/BlobPreview.svelte

@@ -61,8 +61,9 @@
   }
 </script>
 
-<div class="preview" bind:clientHeight>
+<div class="preview">
   {#if handled}
+    <div class="inner" bind:clientHeight>
       {#if !loaded}
         <Spinner centered="absolute" />
       {/if}
@@ -114,7 +115,7 @@
             on:error={() => (handled = false)}
           />
           {#if mediaDuration}
-          <div class="duration" style="--font-size: {clientHeight * 0.28}px">
+            <div class="duration" style="--font-size: {clientHeight * 0.66}px">
               {mediaDuration}
             </div>
           {/if}
@@ -138,6 +139,7 @@
           />
         </div>
       {/if}
+    </div>
   {:else}
     <div class="hashbadge">
       <HashBadge {address} />
@@ -153,6 +155,10 @@
     min-height: 0;
     display: flex;
     flex-direction: column;
+
+    .inner {
+      display: relative;
+    }
   }
 
   .hashbadge {
@@ -201,8 +207,8 @@
     grid-template-columns: repeat(2, 1fr);
     grid-template-rows: repeat(2, 1fr);
 
-    padding: .25rem;
-    gap: .25rem;
+    padding: 0.25rem;
+    gap: 0.25rem;
     border: 1px solid var(--foreground);
     border-radius: 4px;