feat(ui): icon-only header actions and side-nav separators

- Help and Sign in/out become icon-only Carbon cds-header-global-action
  items (real links, accessible name in a visually-hidden span); the
  header nav keeps just Home + the tools.
- Side nav gains a separator so Home, the tools, and Help/Sign In/Out
  form three groups.
- Drop the now-unused header-nav-divider rule.

tools/server.js

@@ -134,10 +134,12 @@ const appHeader = (session, active) => {
   const sideLink = (href, label, key, icon) =>
     `<cds-side-nav-link href="${href}"${key === active ? ' aria-current="page"' : ''}>${icon || ''}${label}</cds-side-nav-link>`;
   const name = session ? (session.firstName || session.phone || '') : '';
-  // Auth is a menu item now, so the header's right side only carries identity.
+  // Help and the auth action are icon-only global header actions.
+  const headerAction = (href, label, svg, extra = '') =>
+    `<cds-header-global-action href="${href}"${extra}>${svg.replace('slot="title-icon"', 'slot="icon"')}<span class="cds--visually-hidden">${label}</span></cds-header-global-action>`;
   const headerAuth = session
-    ? '<cds-header-nav-item href="/auth/logout" data-signout>Sign out</cds-header-nav-item>'
-    : '<cds-header-nav-item href="/auth/login">Sign in</cds-header-nav-item>';
+    ? headerAction('/auth/logout', 'Sign out', SIDE_NAV_ICONS.logout, ' data-signout')
+    : headerAction('/auth/login', 'Sign in', SIDE_NAV_ICONS.login);
   const sideAuth = session
     ? `<cds-side-nav-link href="/auth/logout" data-signout>${SIDE_NAV_ICONS.logout}Sign out</cds-side-nav-link>`
     : `<cds-side-nav-link href="/auth/login">${SIDE_NAV_ICONS.login}Sign in</cds-side-nav-link>`;
@@ -150,13 +152,14 @@ const appHeader = (session, active) => {
   <cds-header-nav>
     ${toolLink('/', 'Home', 'home')}
     ${session ? `${toolLink('/cropper', 'Image Cropper', 'cropper')}
-    ${toolLink('/fingerprint', 'Fingerprint Agent', 'fingerprint')}
-    <span class="header-nav-divider" aria-hidden="true"></span>` : ''}
-    ${toolLink('/help', 'Help', 'help')}
-    ${headerAuth}
+    ${toolLink('/fingerprint', 'Fingerprint Agent', 'fingerprint')}` : ''}
   </cds-header-nav>
   ${active === 'fingerprint' ? '<cds-tag id="agent-status" type="red" class="header-agent">Agent offline</cds-tag>' : ''}
-  ${session ? `<div class="header-right"><span class="user-chip"><span class="avatar">${esc(name.trim().slice(0, 2).toUpperCase())}</span>${esc(name)}</span></div>` : ''}
+  <div class="header-right">
+    ${headerAction('/help', 'Help', SIDE_NAV_ICONS.help)}
+    ${headerAuth}
+    ${session ? `<span class="user-chip"><span class="avatar">${esc(name.trim().slice(0, 2).toUpperCase())}</span>${esc(name)}</span>` : ''}
+  </div>
 </cds-header>
 <cds-side-nav aria-label="Tools" id="side-nav">
   <div class="side-nav-brand">
@@ -164,6 +167,7 @@ const appHeader = (session, active) => {
   </div>
   <cds-side-nav-items>
     ${sideLink('/', 'Home', 'home', SIDE_NAV_ICONS.home)}
+    <cds-side-nav-divider></cds-side-nav-divider>
     ${session ? `${sideLink('/cropper', 'Image Cropper', 'cropper', SIDE_NAV_ICONS.crop)}
     ${sideLink('/fingerprint', 'Fingerprint Agent', 'fingerprint', SIDE_NAV_ICONS.fingerprint)}
     <cds-side-nav-divider></cds-side-nav-divider>` : ''}