src/app.js

@@ -17,7 +17,7 @@ React.render(html`
     <${Store.Provider}>
         <${UI.Select}/>
 
-        <div class="flex">
+        <div class="flex items-center">
             <${UI.Controls}/>
             <div class="flex-1">
                 <${UI.Chart}>
@@ -25,6 +25,6 @@ React.render(html`
                 <//>
             </div>
         </div>
-        
+
     <//>
 `, ShadowDiv);

src/twind.js

@@ -68,7 +68,7 @@ export const Configure = {
             }
         ],
         [ 'box-notch', "border-t(1 [#ffffff]) border-b(1 [#00000033]) flex items-center justify-end gap-1 p-2" ],
-        [ "box-buttons", "flex gap-1 items-center p-2 rounded-lg bg-gradient-to-b from-zinc-300 border-b(1 [#ffffff]) border-t(1 [#00000033])"]
+        [ "box-buttons", "flex gap-1 items-center p-2 rounded-lg bg-gradient-to-b from-[#00000022] border-b(1 [#ffffff]) border-t(1 [#00000033])"]
     ],
     presets: [TWPreTail(), TWPreAuto()]
 };

src/ui.js

@@ -88,7 +88,7 @@ export const Controls =()=>
     const classTitle = "flex-1 text-sm"
 
     return html`
-    <div class="self-start font-sans bg-metal rounded-lg overflow-hidden">
+    <div class="font-sans bg-metal rounded-lg overflow-hidden">
         <div class="box-notch">
             <div class=${classTitle}>Channel</div>
             <div class="box-buttons">