fix(tasks-ui): postmodern chrome, working clicks, adaptive layout, lean cards

Review feedback from the live 3384 install, fixed at the root:

- COLORS: the new stylesheet used var(--dsw-alias-accent) in 17 places — a
  token the DSH theme does NOT define, so every declaration was dropped
  (older files only survived because they carry fallbacks); container edges
  used border-l1 (4% black, invisible). Accent now rides
  --dsw-alias-state-business-primary, container edges --dsw-alias-border-l4.
- CLICKS: the canvas called setPointerCapture on pointerdown, which
  retargets the derived click to the container and killed every node (and
  ⓘ) interaction; jsdom cannot see this, a real browser can. Capture is
  gone and panning only starts from the background.
- LAYOUT: fit gave up silently at zero container size and never retried,
  centered only horizontally, and capped at 100% while a five-child level
  scaled to 35%. Now: ResizeObserver + first non-zero fit, both axes
  centered, a 0.78 readability floor, and layoutTasksGraphForWidth picks
  the flattest sibling arrangement that still meets that floor.
- CARDS: title (one line) + mono meta + live line only; display title,
  team role, full model id and latest text moved into the ⓘ popover.
- PANEL: metrics follow the approved 360x660 mockup (132x46 cards, 112 row
  stride), explicit line-heights, user-select:none, horizontal control
  cluster with a labelled mode button, always-visible team board strip.
- Tokens for two new popover headings across all 20 dictionaries.

Tests: 3 new page-interaction specs (click after background pointerdown,
node gestures never pan, team board visible without a click) and a
rewritten 9-case layout suite (band wrap, row reservation, width solver,
reserved live row). Full suite 1400 passed / 133 files.

src/client/JobsDrawer.tsx

@@ -103,12 +103,17 @@ export function JobsDrawer(props: JobsDrawerProps): ReactNode {
         onClick={() => { setManualOpen(!open) }}
       >
         <span>{t('jobs')}</span>
+        <span className={css.jobsBigNum}>{liveCount > 0 ? liveCount : rows.length}</span>
         <span className={css.jobsDrawerCount}>{countLabel}</span>
-        {!open && !autoOpen && <span className={css.jobsDrawerAuto}>{t('jobsAutoCollapsed')}</span>}
-        <span className={clsx(css.jobsDrawerChevron, open && css.jobsDrawerChevronOpen)} aria-hidden="true">
+        <span className={clsx(css.jobsDrawerChev, open && css.jobsDrawerChevOpen)} aria-hidden="true">
           <IconChevronUpOutline14 size={12} />
         </span>
       </button>
+      {!autoOpen && (
+        <div className={css.jobsAutoNote}>
+          {t('jobsAutoCollapsed')}
+        </div>
+      )}
       {open && (
         <div className={css.jobsDrawerBody}>
           {rows.map((row) => {
@@ -135,14 +140,10 @@ export function JobsDrawer(props: JobsDrawerProps): ReactNode {
                   title={t('jobViewOutput')}
                   onClick={(event) => { onOpenOutput(row, event.currentTarget) }}
                 >
-                  <StateDot state={jobDotState(job.status)} size={8} />
-                  <span className={css.jobsContent}>
-                    <span className={css.jobsLabelLine}>
-                      <span className={css.jobsKind}>{job.kind}</span>
-                      <span className={css.jobsLabel} title={job.label}>{job.label}</span>
-                    </span>
-                    <span className={css.jobsSecondary}>{secondary}</span>
-                  </span>
+                  <StateDot state={jobDotState(job.status)} size={6} />
+                  <span className={css.jobsKind}>{job.kind}</span>
+                  <span className={css.jobsLabel} title={job.label}>{job.label}</span>
+                  <span className={css.jobsMeta}>{secondary}</span>
                 </button>
                 {job.status === 'running' && (
                   <button
@@ -157,7 +158,7 @@ export function JobsDrawer(props: JobsDrawerProps): ReactNode {
                       else setArmedId(job.id)
                     }}
                   >
-                    {armed ? t('jobKillConfirm') : <IconStopOutline16 size={12} />}
+                    {armed ? '!' : <IconStopOutline16 size={12} />}
                   </button>
                 )}
                 {killFailed && <span className={css.jobsKillError}>{t('jobKillError')}</span>}