fix: align UML phase controls to the right

react/src/react.css

@@ -815,6 +815,10 @@
   color: #555;
   font-size: 10px;
 }
+.uml-snapshot-header > div:first-child {
+  flex: 1 1 auto;
+  min-width: 0;
+}
 .uml-phase-actions,
 .uml-step-actions {
   display: flex;
@@ -823,7 +827,12 @@
   gap: 3px;
 }
 .uml-phase-actions {
+  flex: 0 0 auto;
+  flex-wrap: nowrap;
   justify-content: flex-end;
+  align-self: flex-start;
+  margin-left: auto;
+  white-space: nowrap;
 }
 .uml-phase-actions button,
 .uml-step-actions button,
@@ -1469,7 +1478,8 @@ text.uml-step-element-active {
     border: 0;
   }
   .uml-phase-actions {
-    justify-content: flex-start;
+    width: 100%;
+    justify-content: flex-end;
   }
   .uml-code-view,
   .uml-state-grid {