fix: minor UI updates

src/components/piano-roll/PianoRoll.css

@@ -137,7 +137,8 @@
 .piano-roll-title {
   flex: 1;
   text-align: center;
-  font-size: 14px;
+  font-size: 12px;
+  font-weight: bold;
   color: #e0e0e0;
   /* text-transform: uppercase; */
   cursor: pointer;

src/components/piano-roll/PianoRollHeader.tsx

@@ -19,12 +19,6 @@ const PianoRollHeader: React.FC<PianoRollHeaderProps> = ({
       className="piano-roll-header"
       onMouseDown={onMouseDown}
     >
-      <button 
-        className="close-button"
-        onClick={onClose}
-      >
-        <FaTimes />
-      </button>
       <div 
         className="piano-roll-title"
         onClick={onTitleClick}
@@ -32,6 +26,12 @@ const PianoRollHeader: React.FC<PianoRollHeaderProps> = ({
       >
         {title}
       </div>
+      <button 
+        className="close-button"
+        onClick={onClose}
+      >
+        <FaTimes />
+      </button>
     </div>
   );
 };