feat(FN-4554): complete Step 4 — surface copilot device code in UI

Fusion-Task-Id: FN-4554
Fusion-Task-Lineage: 12d517c5-1954-4b27-8c63-c7f0dde93d3f

packages/dashboard/app/components/SettingsModal.css

@@ -1507,6 +1507,30 @@
   gap: var(--space-sm);
 }
 
+.auth-device-code-panel {
+  margin-top: var(--space-sm);
+  padding: var(--space-sm);
+  border: var(--btn-border-width) solid var(--border);
+  border-radius: var(--radius-md);
+  background: color-mix(in srgb, var(--surface) 85%, transparent);
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-sm);
+}
+
+.auth-device-code-pill {
+  font-family: var(--font-mono);
+  font-size: calc(var(--space-md) + var(--space-xs) * 0.5);
+  letter-spacing: var(--space-xs);
+  padding: var(--space-sm) var(--space-md);
+  border-radius: var(--radius-pill);
+  border: var(--btn-border-width) solid var(--border);
+  background: var(--card);
+  color: var(--text);
+  display: inline-flex;
+  align-self: flex-start;
+}
+
 /* === Key Hint === */
 .auth-key-hint {
   font-family: var(--font-mono);
@@ -1860,6 +1884,15 @@
     justify-content: flex-end;
   }
 
+  .auth-device-code-panel {
+    width: 100%;
+  }
+
+  .auth-device-code-pill {
+    max-width: 100%;
+    overflow-wrap: anywhere;
+  }
+
   .auth-provider-info {
     width: 100%;
     flex-basis: 100%;