feat(web): move edit/delete buttons into tab bar on item detail

Relocate Edit and Delete buttons from the header row into the tab bar,
grouping them with tab navigation to reduce mouse travel. Adds Pencil
and Trash2 icons for quick visual recognition.

Header now only shows part number, type badge, and close button.

Closes #119

web/src/components/items/ItemDetail.tsx

@@ -1,5 +1,5 @@
 import { useState, useEffect } from "react";
-import { X } from "lucide-react";
+import { X, Pencil, Trash2 } from "lucide-react";
 import { get } from "../../api/client";
 import type { Item } from "../../api/types";
 import { MainTab } from "./MainTab";
@@ -114,22 +114,6 @@ export function ItemDetail({
           {item.item_type}
         </span>
         <span style={{ flex: 1 }} />
-        {isEditor && (
-          <>
-            <button
-              onClick={() => onEdit(item.part_number)}
-              style={headerBtnStyle}
-            >
-              Edit
-            </button>
-            <button
-              onClick={() => onDelete(item.part_number)}
-              style={{ ...headerBtnStyle, color: "var(--ctp-red)" }}
-            >
-              Delete
-            </button>
-          </>
-        )}
         <button
           onClick={onClose}
           style={{
@@ -142,11 +126,11 @@ export function ItemDetail({
         </button>
       </div>
 
-      {/* Tabs */}
+      {/* Tabs + actions */}
       <div
         style={{
           display: "flex",
-          gap: "0",
+          alignItems: "center",
           borderBottom: "1px solid var(--ctp-surface1)",
           backgroundColor: "var(--ctp-mantle)",
           flexShrink: 0,
@@ -175,6 +159,33 @@ export function ItemDetail({
             {tab.label}
           </button>
         ))}
+        <span style={{ flex: 1 }} />
+        {isEditor && (
+          <div
+            style={{ display: "flex", gap: "0.25rem", paddingRight: "0.5rem" }}
+          >
+            <button
+              onClick={() => onEdit(item.part_number)}
+              style={{
+                ...tabActionBtnStyle,
+                color: "var(--ctp-subtext1)",
+              }}
+              title="Edit item"
+            >
+              <Pencil size={13} /> Edit
+            </button>
+            <button
+              onClick={() => onDelete(item.part_number)}
+              style={{
+                ...tabActionBtnStyle,
+                color: "var(--ctp-red)",
+              }}
+              title="Delete item"
+            >
+              <Trash2 size={13} /> Delete
+            </button>
+          </div>
+        )}
       </div>
 
       {/* Tab Content */}
@@ -207,3 +218,15 @@ const headerBtnStyle: React.CSSProperties = {
   fontSize: "var(--font-table)",
   padding: "0.25rem 0.5rem",
 };
+
+const tabActionBtnStyle: React.CSSProperties = {
+  display: "inline-flex",
+  alignItems: "center",
+  gap: "0.25rem",
+  background: "none",
+  border: "none",
+  cursor: "pointer",
+  fontSize: "var(--font-table)",
+  padding: "0.25rem 0.5rem",
+  borderRadius: "0.25rem",
+};