app adjustments

ui/src/App.jsx

@@ -56,15 +56,26 @@ function App() {
 
   return (
     <main className="layout">
-      <StackPresetToolbar
-        presetName={presetName}
-        selectedPresetName={selectedPresetName}
-        stackPresets={stackPresets}
-        onPresetNameChange={setPresetName}
-        onSelectedPresetNameChange={setSelectedPresetName}
-      />
+      <header className="app-header">
+        <div>
+          <h1>Video Shader Toys</h1>
+          <p className="muted">Live shader stack, DeckLink status, and runtime controls.</p>
+        </div>
+        <div className={`status-pill${runtime.compileSucceeded ? " status-pill--ready" : " status-pill--error"}`}>
+          {runtime.compileSucceeded ? "Ready" : "Compile Error"}
+        </div>
+      </header>
 
-      <StatusPanels app={app} performance={performance} runtime={runtime} video={video} />
+      <section className="dashboard-grid">
+        <StatusPanels app={app} performance={performance} runtime={runtime} video={video} />
+        <StackPresetToolbar
+          presetName={presetName}
+          selectedPresetName={selectedPresetName}
+          stackPresets={stackPresets}
+          onPresetNameChange={setPresetName}
+          onSelectedPresetNameChange={setSelectedPresetName}
+        />
+      </section>
 
       <LayerStack
         dragLayerId={dragLayerId}