diff --git a/apps/web/src/components/DiagramEditorPane.test.mjs b/apps/web/src/components/DiagramEditorPane.test.mjs
index db41885a..2672f035 100644
--- a/apps/web/src/components/DiagramEditorPane.test.mjs
+++ b/apps/web/src/components/DiagramEditorPane.test.mjs
@@ -98,7 +98,7 @@ describe("diagram editor canvas surface", () => {
 
   test("provides architecture components, boundaries, semantic edges, and editable labels", () => {
     expect(source).toContain('document.kind === "architecture"');
-    expect(source).toContain('addNode("service")');
+    expect(source).not.toContain('onClick={() => addNode("service")}');
     expect(source).toContain('{ shape: "database", icon: Database');
     expect(source).toContain('{ shape: "boundary", icon: Box');
     expect(source).toContain('t("diagram.architectureConnectHint")');
@@ -128,6 +128,8 @@ describe("diagram editor canvas surface", () => {
     expect(source).toContain("<Collapsible key={category.id} defaultOpen>");
     expect(source).toContain("category.items.filter");
     expect(source).toContain('className="grid grid-cols-7 gap-1 px-1 pb-2"');
+    expect(source).toContain('text-xs font-semibold');
+    expect(source).not.toContain('{category.items.length}</span>');
     expect(source).toContain('<TooltipContent side="top">');
     expect(source).toContain('aria-label={label}');
     expect(source).toContain('options.label ??');
diff --git a/apps/web/src/components/DiagramEditorPane.tsx b/apps/web/src/components/DiagramEditorPane.tsx
index ce412d9e..4e3ac4d7 100644
--- a/apps/web/src/components/DiagramEditorPane.tsx
+++ b/apps/web/src/components/DiagramEditorPane.tsx
@@ -343,10 +343,9 @@ const ArchitectureComponentLibrary = ({
           {categories.length > 0 ? categories.map((category) => (
             <Collapsible key={category.id} defaultOpen>
               <DropdownMenuItem asChild onSelect={(event) => event.preventDefault()}>
-                <CollapsibleTrigger className="group flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-left text-sm font-semibold text-slate-700 hover:bg-slate-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--brand-green)]">
+                <CollapsibleTrigger className="group flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-left text-xs font-semibold text-slate-700 hover:bg-slate-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--brand-green)]">
                   <ChevronDown className="h-4 w-4 text-slate-400 transition-transform group-data-[state=closed]:-rotate-90" />
                   {t(category.labelKey)}
-                  <span className="ml-auto text-xs font-normal text-slate-400">{category.items.length}</span>
                 </CollapsibleTrigger>
               </DropdownMenuItem>
               <CollapsibleContent>
@@ -2083,12 +2082,6 @@ export const DiagramEditorPane = ({
               </Tooltip>
             ) : document.kind === "architecture" ? (
               <>
-                <Tooltip>
-                  <TooltipTrigger asChild>
-                    <Button size="sm" variant="soft" onClick={() => addNode("service")}><Server className="h-4 w-4" />{t("diagram.addService")}</Button>
-                  </TooltipTrigger>
-                  <TooltipContent>{t("diagram.architectureShortcuts")}</TooltipContent>
-                </Tooltip>
                 <ArchitectureComponentLibrary
                   onAdd={(item) => addNode(item.shape, {
                     label: t(item.labelKey),