fix(KB-657): fix test bugs and add InlineCreateCard CSS styles

- Fix QuickEntryBox test missing props destructuring
- Fix QuickEntryBox test using wrong initial state expectation
- Add .inline-create-toggle CSS styles for toggle button
- Add .inline-create-card--collapsed/.expanded modifier classes
- Add .inline-create-main-row layout styles

packages/dashboard/app/components/__tests__/QuickEntryBox.test.tsx

@@ -246,7 +246,7 @@ describe("QuickEntryBox", () => {
   });
 
   it("maintains the collapsed and expanded styling contract on the root container", () => {
-    renderQuickEntryBox();
+    renderQuickEntryBox({}, { startCollapsed: true });
     const box = screen.getByTestId("quick-entry-box");
 
     expect(box.classList.contains("quick-entry-box--collapsed")).toBe(true);
@@ -1306,7 +1306,7 @@ describe("QuickEntryBox", () => {
     });
 
     it("clicking save button persists to localStorage", async () => {
-      renderQuickEntryBox({}, { startCollapsed: true });
+      const { props } = renderQuickEntryBox({}, { startCollapsed: true });
       // Component starts with disclosure expanded by default
       expandQuickEntry();
       const textarea = screen.getByTestId("quick-entry-input");

packages/dashboard/app/styles.css

@@ -3913,6 +3913,64 @@ body {
   color: var(--text-dim);
 }
 
+/* Inline Create Card Toggle Button */
+.inline-create-toggle {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  padding: 4px;
+  height: 28px;
+  width: 28px;
+  flex-shrink: 0;
+  background: transparent;
+  border: 1px solid transparent;
+  border-radius: var(--radius-sm);
+  color: var(--text-muted);
+  cursor: pointer;
+  transition: all var(--transition-fast);
+}
+
+.inline-create-toggle:hover {
+  background: var(--card-hover);
+  border-color: var(--border);
+  color: var(--text);
+}
+
+.inline-create-toggle:focus-visible {
+  outline: 2px solid var(--focus-ring);
+  outline-offset: 2px;
+}
+
+/* Inline Create Card Main Row */
+.inline-create-main-row {
+  display: flex;
+  align-items: flex-start;
+  gap: 8px;
+}
+
+.inline-create-main-row .inline-create-input {
+  flex: 1;
+  min-width: 0;
+}
+
+/* Collapsed state */
+.inline-create-card--collapsed {
+  padding: 8px 10px;
+}
+
+.inline-create-card--collapsed .inline-create-input {
+  min-height: 28px;
+}
+
+/* Expanded state */
+.inline-create-card--expanded {
+  padding: 10px 12px;
+}
+
+.inline-create-card--expanded .inline-create-input {
+  min-height: 32px;
+}
+
 .inline-create-footer {
   display: flex;
   align-items: flex-start;