diff --git a/src/components/SettingsDialog.tsx b/src/components/SettingsDialog.tsx
index 70699575..44951bd1 100644
--- a/src/components/SettingsDialog.tsx
+++ b/src/components/SettingsDialog.tsx
@@ -834,11 +834,7 @@ export function SettingsDialog(props: SettingsDialogProps) {
                 variant={showJsonView() ? "secondary" : "ghost"}
                 size="sm"
                 icon={showJsonView() ? <Icon name="gear" style={{ width: "14px", height: "14px" }} /> : <Icon name="file-lines" style={{ width: "14px", height: "14px" }} />}
-                style={showJsonView() ? {
-                  background: "rgba(234, 179, 8, 0.2)",
-                  color: "var(--cortex-warning)",
-                  border: "1px solid rgba(234, 179, 8, 0.3)",
-                } : {}}
+                class={showJsonView() ? "settings-json-toggle-active" : ""}
                 title={showJsonView() ? "Switch to GUI Settings" : "Open Settings (JSON)"}
               >
                 {showJsonView() ? "GUI Settings" : "JSON"}
diff --git a/src/components/debugger/CallStackPanel.tsx b/src/components/debugger/CallStackPanel.tsx
index 5b702af2..3febad18 100644
--- a/src/components/debugger/CallStackPanel.tsx
+++ b/src/components/debugger/CallStackPanel.tsx
@@ -143,6 +143,8 @@ export function CallStackPanel() {
   };
 
   const handleCopyStack = async () => {
+    // Guard: do not overwrite clipboard when there are no frames
+    if (frames().length === 0) return;
     const text = frames()
       .map((f) => {
         const loc = f.source?.path ? `${f.source.path}:${f.line}${f.column > 0 ? `:${f.column}` : ""}` : "unknown";
@@ -162,7 +164,7 @@ export function CallStackPanel() {
               <Icon name={showThreads() ? "eye" : "eye-slash"} size={12} />
             </IconButton>
           </Show>
-          <IconButton size="sm" variant="ghost" onClick={handleCopyStack} title="Copy Call Stack">
+          <IconButton size="sm" variant="ghost" onClick={handleCopyStack} disabled={frames().length === 0} title="Copy Call Stack">
             <Icon name="copy" size={12} />
           </IconButton>
         </div>
diff --git a/src/styles/settings.css b/src/styles/settings.css
index ce77d962..af2f5486 100644
--- a/src/styles/settings.css
+++ b/src/styles/settings.css
@@ -883,3 +883,20 @@
     text-overflow: ellipsis;
   }
 }
+
+/* ==========================================================================
+   JSON/GUI Settings Toggle Button
+   ========================================================================== */
+
+/* Active state (JSON mode) */
+.settings-json-toggle-active {
+  background: rgba(234, 179, 8, 0.2) !important;
+  color: var(--cortex-warning) !important;
+  border: 1px solid rgba(234, 179, 8, 0.3) !important;
+}
+
+/* Hover state for active toggle */
+.settings-json-toggle-active:hover {
+  background: rgba(234, 179, 8, 0.35) !important;
+  border-color: rgba(234, 179, 8, 0.5) !important;
+}