polish(network): visual refinements across node, edge, and panel components

- DeviceNode: flat bg-card (no surface gradient), darker icon plate inset,
  correct text-muted token for category label
- GroupNode: label pill gets bg-card/90 background so it reads against canvas
- ConnectionEdge: label now has border + bg-card so it doesn't float invisible
- BaseHandle: tightened to 12px with accent-toned border
- NodeStatusIndicator: glow reduced to 0.15 opacity (design system compliant)
- ContextMenu: Ungroup now uses Ungroup icon instead of BoxSelect
- DeviceToolbar: group type icons coloured with semantic palette
- PropertiesPanel: empty state gets icon tile + cleaner copy hierarchy
- DiagramEditor: shortcut ? button repositioned above MiniMap, accent hover
- NetworkDiagrams list: card thumbnail placeholder uses dot-grid pattern,
  card menu gets icons and divider before destructive action

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

frontend/src/components/network/nodes/DeviceNode.tsx

@@ -84,7 +84,7 @@ function DeviceNodeComponent({ id, data, selected, width, height }: NodeProps) {
       <NodeStatusIndicator status={status}>
         <NodeTooltip>
           <NodeTooltipTrigger>
-            <BaseNode className="group h-full w-full bg-gradient-to-b from-card via-card to-page/70">
+            <BaseNode className="group h-full w-full bg-card">
               <div className={cn('pointer-events-none absolute inset-x-0 top-0 h-10 bg-gradient-to-b opacity-80', surfaceClass)} />
               <BaseNodeHeader className="flex h-full flex-col items-center justify-center gap-2 px-2 py-3">
                 <div
@@ -94,7 +94,7 @@ function DeviceNodeComponent({ id, data, selected, width, height }: NodeProps) {
                   )}
                   style={{ width: iconPlateSize, height: iconPlateSize }}
                 >
-                  <div className="absolute inset-[4px] rounded-[10px] border border-white/6 bg-page/55" />
+                  <div className="absolute inset-[4px] rounded-[10px] border border-white/[0.06] bg-sidebar/50" />
                   <div className="relative z-10">
                     <Icon size={iconPx} style={{ color }} />
                   </div>
@@ -135,7 +135,7 @@ function DeviceNodeComponent({ id, data, selected, width, height }: NodeProps) {
                 )}
                 <span
                   style={{ fontSize: metaPx }}
-                  className="text-[9px] uppercase tracking-[0.16em] text-muted-foreground/80"
+                  className="text-[9px] uppercase tracking-[0.16em] text-muted"
                 >
                   {CATEGORY_LABELS[category] ?? nodeData.deviceType.replace(/-/g, ' ')}
                 </span>