Refactor Lucide icon rendering by replacing nodes with root across components and fix unintended character encoding issues in placeholders and text.

web/components/registry/material-list.mjs

@@ -1,4 +1,4 @@
-import { api } from '../../lib/api.mjs';
+import { api } from '../../lib/api.mjs';
 import './material-form.mjs';
 
 class MaterialList extends HTMLElement {
@@ -65,7 +65,7 @@ class MaterialList extends HTMLElement {
       <div class="page-header">
         <h1>Materials</h1>
         <div class="toolbar">
-          <input class="search-input" id="search" placeholder="Search materials…" value="${this.#esc(this.#search)}">
+          <input class="search-input" id="search" placeholder="Search materials…" value="${this.#esc(this.#search)}">
           <button class="btn-primary" id="new-btn">
             <i data-lucide="plus" style="width:14px;height:14px"></i> Add Material
           </button>
@@ -103,7 +103,7 @@ class MaterialList extends HTMLElement {
 
       <material-form id="material-form"></material-form>`;
 
-    if (window.lucide) lucide.createIcons({ nodes: [s] });
+    if (window.lucide) lucide.createIcons({ root: s });
 
     const searchEl = s.querySelector('#search');
     let debounce;