feat(client): hold the hover tint on the expanded browser category header

The Context browser's category header carried only the hover utility, so
the tint vanished the moment the pointer left an expanded card and the
header melted into its body. The open state now keeps the hover
background via a lc-br-cat-open state class - the same token as the
hover and hover-link tints - on every category card alike.

src/client/components/browser.tsx

@@ -1170,7 +1170,9 @@ export function makeContextBrowser(
               <div key={c.key} className={'lc-br-cat' + (openable ? '' : ' lc-br-cat-empty')}>
                 <button
                   type="button"
-                  className={'lc-br-cat-row hover:bg-(--dsw-alias-interactive-bg-hover)' + (linked && props.hoverKey === c.key ? ' lc-br-cat-on' : '')}
+                  className={'lc-br-cat-row hover:bg-(--dsw-alias-interactive-bg-hover)'
+                    + (open ? ' lc-br-cat-open' : '')
+                    + (linked && props.hoverKey === c.key ? ' lc-br-cat-on' : '')}
                   /* v8 ignore start -- the handlers exist only when linked,
                      and linked already requires onHoverKey defined (above). */
                   onMouseEnter={linked ? () => { if (props.onHoverKey !== undefined) props.onHoverKey(c.key) } : undefined}

src/client/styles/browser.css

@@ -23,6 +23,9 @@
  */
 .lc-br-cat-on { background: var(--dsw-alias-interactive-bg-hover); }
 .lc-br-cat-on i { box-shadow: 0 0 0 1px var(--dsw-alias-brand-primary); }
+/* Expanded category: the open header holds the hover tint, so the header keeps
+   reading as the raised face over its body — every category card alike. */
+.lc-br-cat-open { background: var(--dsw-alias-interactive-bg-hover); }
 .lc-br-cat-row i { display: inline-block; width: 8px; height: 8px; border-radius: 2px; flex: none; transition: box-shadow var(--ds-transition-duration, 0.2s) var(--ds-ease-in-out, ease-in-out); }
 .lc-br-cat-label { font-weight: 600; }
 .lc-br-cat-count { color: var(--dsw-alias-label-secondary); font-size: 12px; white-space: nowrap; }

tests/client/components/browser.spec.ts

@@ -314,6 +314,8 @@ describe('ContextBrowser header epochs', () => {
     const body = query(m.container, '.lc-br-body')
     assert.ok(text(body).includes('SYS B'), 'the newest epoch’s prompt shows on the live surface')
     assert.ok(text(body).includes('2 lines'), 'line count rides the section head')
+    // The open header holds the hover tint, every category alike.
+    assert.ok(catRow(m, 'system').className.includes('lc-br-cat-open'))
     // The single system row is already expanded.
     assert.equal(queryAll(m.container, '.lc-br-content').length, 1)
     assert.ok(queryAll(m.container, '.lc-ts-desc-md').length >= 1, 'markdown view by default')
@@ -326,6 +328,7 @@ describe('ContextBrowser header epochs', () => {
     assert.ok(queryAll(m.container, '.lc-ts-desc-md').length >= 1, 'markdown restored')
     await click(catRow(m, 'system'))
     assert.equal(queryAll(m.container, '.lc-br-body').length, 0)
+    assert.ok(!catRow(m, 'system').className.includes('lc-br-cat-open'))
     await m.unmount()
   })