fix: category handling

src/renderer/components/SettingsView/SettingsView.css

@@ -359,6 +359,78 @@
   background-color: var(--vscode-button-secondaryHoverBackground);
 }
 
+/* Categories management styles */
+.categories-list {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  padding: 12px 16px;
+}
+
+.category-item {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 6px 10px;
+  background-color: var(--vscode-badge-background);
+  color: var(--vscode-badge-foreground);
+  border-radius: 4px;
+  font-size: 13px;
+}
+
+.category-name {
+  font-weight: 500;
+}
+
+.category-remove {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 16px;
+  height: 16px;
+  padding: 0;
+  background: transparent;
+  border: none;
+  color: var(--vscode-badge-foreground);
+  cursor: pointer;
+  opacity: 0.6;
+  font-size: 10px;
+  border-radius: 50%;
+  transition: opacity 0.15s, background-color 0.15s;
+}
+
+.category-remove:hover {
+  opacity: 1;
+  background-color: rgba(255, 255, 255, 0.1);
+}
+
+.category-add-form {
+  display: flex;
+  gap: 8px;
+  padding: 12px 16px;
+  align-items: center;
+}
+
+.category-add-form input {
+  flex: 1;
+  max-width: 300px;
+  padding: 6px 12px;
+  font-size: 13px;
+  background-color: var(--vscode-input-background);
+  border: 1px solid var(--vscode-input-border);
+  color: var(--vscode-input-foreground);
+  border-radius: 4px;
+  outline: none;
+}
+
+.category-add-form input:focus {
+  border-color: var(--vscode-focusBorder);
+}
+
+.category-add-form input::placeholder {
+  color: var(--vscode-input-placeholderForeground);
+}
+
 /* Responsive - narrow sidebar */
 @media (max-width: 600px) {
   .settings-nav {