fix: minor updated color palette for some components; updated default region/track names for stem separation.

src/components/ChatBox.css

@@ -149,7 +149,7 @@
 }
 
 .chatbox-input:focus {
-  border-color: #6a6a6a;
+  border-color: #5a9fd4;
   background-color: #4a4a4a;
 }
 

src/components/KGOnePanel.css

@@ -59,7 +59,7 @@
 
 .kgone-tab.active {
   color: #e0e0e0;
-  border-bottom-color: #7a9cff;
+  border-bottom-color: #5a9fd4;
 }
 
 /* Scrollable body */
@@ -102,7 +102,7 @@
 .kgone-input:focus,
 .kgone-textarea:focus,
 .kgone-select:focus {
-  border-color: #5a6aaa;
+  border-color: #5a9fd4;
 }
 
 .kgone-textarea {
@@ -277,7 +277,7 @@
 }
 
 .kgone-player-play-btn:hover {
-  color: #7a9cff;
+  color: #5a9fd4;
 }
 
 .kgone-player-progress-track {
@@ -296,7 +296,7 @@
 
 .kgone-player-progress-fill {
   height: 100%;
-  background-color: #7a9cff;
+  background-color: #5a9fd4;
   border-radius: 2px;
   pointer-events: none;
   transition: width 0.1s linear;
@@ -336,7 +336,7 @@
 }
 
 .kgone-player-download-btn:hover {
-  color: #7a9cff;
+  color: #5a9fd4;
 }
 
 /* ── Generation state feedback ─────────────────────────────────────────────── */
@@ -364,8 +364,13 @@
 }
 
 @keyframes kgone-spin {
-  from { transform: rotate(0deg); }
+  from {
-  to   { transform: rotate(360deg); }
+    transform: rotate(0deg);
+  }
+
+  to {
+    transform: rotate(360deg);
+  }
 }
 
 /* Stem players (Separator tab) */
@@ -390,7 +395,7 @@
 .kgone-checkbox-row input[type="checkbox"] {
   width: 14px;
   height: 14px;
-  accent-color: #7a9cff;
+  accent-color: #5a9fd4;
   cursor: pointer;
 }
 

src/components/KGOnePanel.tsx

@@ -826,6 +826,7 @@ const SeparatorTab: React.FC = () => {
   const taskIdRef = useRef<string>('');
   const originalRegionRef = useRef<{
     regionName: string;
+    trackName: string;
     startFromBeat: number;
     trackIndex: number;
   } | null>(null);
@@ -866,6 +867,7 @@ const SeparatorTab: React.FC = () => {
     // Capture snapshot before anything changes — selection may shift during generation
     originalRegionRef.current = {
       regionName: selectedAudioRegion.region.getName(),
+      trackName: selectedAudioRegion.trackName,
       startFromBeat: selectedAudioRegion.region.getStartFromBeat(),
       trackIndex: selectedAudioRegion.trackIndex,
     };
@@ -1043,7 +1045,8 @@ const SeparatorTab: React.FC = () => {
           await KGAudioFileStorage.storeAudioFile(projectName, fileId, audioFile);
 
           return {
-            trackName: `${snap.regionName} (${stem.name})`,
+            trackName: `${snap.trackName} - ${stem.name}`,
+            regionName: `${snap.regionName} - ${stem.name}`,
             audioFileId: fileId,
             audioFileName: fileName,
             audioDurationSeconds: toneBuffer.duration,

src/components/settings/sections/GeneralSettings.tsx

@@ -500,7 +500,7 @@ const GeneralSettings: React.FC = () => {
                   e.preventDefault();
                   handleSoundfontBaseUrlChange('https://cdn.jsdelivr.net/npm/soundfont-for-samplers/FluidR3_GM/');
                 }}
-                style={{ color: '#646cff', textDecoration: 'underline', cursor: 'pointer' }}
+                style={{ color: '#5a9fd4', textDecoration: 'underline', cursor: 'pointer' }}
               >
                 Restore default
               </a>

src/components/track/RegionItem.tsx

@@ -548,7 +548,7 @@ const RegionItem: React.FC<RegionItemProps> = ({
       data-is-dragging={isDragging}
     >
       <div className="region-header">
-        {audioRegion ? audioRegion.getAudioFileName() : name}
+        {name}
       </div>
       <div className={`region-content${audioRegion ? ' audio-region-content' : ''}`} ref={regionContentRef}>
         {!audioRegion && (

src/core/commands/region/ImportStemsCommand.ts

@@ -12,6 +12,7 @@ import { KGAudioInterface } from '../../audio-interface/KGAudioInterface';
  */
 export interface StemImportEntry {
   trackName: string;
+  regionName: string;
   audioFileId: string;
   audioFileName: string;
   audioDurationSeconds: number;
@@ -128,7 +129,7 @@ export class ImportStemsCommand extends KGCommand {
         regionId,
         trackId.toString(),
         track.getTrackIndex(),
-        stem.audioFileName,
+        stem.regionName,
         this.insertBeat,
         durationInBeats,
         stem.audioFileId,

src/styles/shared.css

@@ -27,7 +27,7 @@
   align-items: center;
   justify-content: center;
   z-index: 1005;
-  margin-left: -50px;
+  margin-left: -120px;
 }
 
 /* Tool buttons (used by Toolbar and PianoRollToolbar) */