feat: add delete button to image toolbar

Trash icon (🗑) appears in the per-image controls when an image is
selected, after the alignment buttons. Calls TipTap's deleteNode()
to remove the node from the document. Turns red on hover.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

frontend/src/components/ImageView.jsx

@@ -2,7 +2,7 @@ import { NodeViewWrapper } from '@tiptap/react'
 
 const SIZES = ['25%', '50%', '75%', '100%']
 
-export default function ImageView({ node, updateAttributes, selected }) {
+export default function ImageView({ node, updateAttributes, deleteNode, selected }) {
   const { src, alt, width = '100%', align = 'center' } = node.attrs
 
   const imgStyle = {
@@ -36,6 +36,12 @@ export default function ImageView({ node, updateAttributes, selected }) {
               >{label}</button>
             ))}
           </div>
+          <span className="image-ctrl-sep" />
+          <button
+            className="img-ctrl-btn img-ctrl-delete"
+            onMouseDown={e => { e.preventDefault(); deleteNode() }}
+            title="Remove image"
+          >🗑</button>
         </div>
       )}
     </NodeViewWrapper>

frontend/src/styles/index.css

@@ -1053,6 +1053,7 @@ button { cursor: pointer; font-family: inherit; }
 }
 .img-ctrl-btn:hover { color: var(--text); background: var(--bg-surface); border-color: var(--border); }
 .img-ctrl-btn.active { color: var(--accent-hi); border-color: var(--accent); }
+.img-ctrl-delete:hover { color: var(--danger); border-color: var(--danger); background: transparent; }
 
 .editor-body .ProseMirror ul,
 .editor-body .ProseMirror ol {