Move preview renderer and HDR pickers above the shader ball

Drop the 'Shader Ball' label; the renderer switch and HDR environment
dropdowns sit side by side at the top of the preview column, above the
swatch. Both pickers take an optional item width.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

src/ui/MaterialEditorPanel.cpp

@@ -287,8 +287,12 @@ void MaterialEditorPanel::Render() {
 }
 
 void MaterialEditorPanel::RenderPreviewPanel() {
-    ImGui::TextUnformatted("Shader Ball");
-    ImGui::Separator();
+    // Renderer switch and HDR environment side by side above the preview.
+    const float halfWidth =
+        (ImGui::GetContentRegionAvail().x - ImGui::GetStyle().ItemSpacing.x) * 0.5f;
+    m_preview.RenderRendererDropdown(halfWidth);
+    ImGui::SameLine();
+    m_preview.RenderLightingDropdown(halfWidth);
 
     if (m_stage && !m_materialPath.IsEmpty()) {
         // Hypershade-style: with a node selected, the ball previews that
@@ -324,10 +328,6 @@ void MaterialEditorPanel::RenderPreviewPanel() {
         ImGui::Dummy(ImVec2(size, size));
     }
 
-    ImGui::Separator();
-    m_preview.RenderRendererDropdown();
-    m_preview.RenderLightingDropdown();
-
     ImGui::Separator();
     ImGui::TextUnformatted("Node Properties");
     ImGui::Separator();