feat(desktop): composer/intro polish + shared ErrorState

- Composer single-line row centers (was bottom-aligned); placeholder
  randomizes per session (starter vs follow-up) without mid-stream flip.
- Drop chat header on brand-new sessions (dead label + border).
- ⌘N flashes its sidebar hint; ⌘. toggles the command center.
- Intro wordmark fills width (drop 8rem fit cap).
- Unify error states on a shared ErrorState component (boundary + updates).

apps/desktop/src/components/chat/intro.tsx

@@ -142,6 +142,8 @@ function pickCopy(copies: IntroCopy[], seed = 0): IntroCopy {
   return copies[Math.abs(seed) % copies.length] || FALLBACK_COPY[0]
 }
 
+const WORDMARK = 'HERMES AGENT'
+
 function resolveCopy(personality?: string, seed?: number): IntroCopy {
   const personalityKey = normalizeKey(personality)
 
@@ -155,7 +157,6 @@ function resolveCopy(personality?: string, seed?: number): IntroCopy {
 export function Intro({ personality, seed }: IntroProps) {
   const [mountSeed] = useState(() => Math.floor(Math.random() * 100000))
   const copy = resolveCopy(personality, mountSeed + (seed ?? 0))
-
   return (
     <div
       className="pointer-events-none flex w-full min-w-0 flex-col items-center justify-center px-3 py-6 text-center text-muted-foreground sm:px-6 lg:px-8"
@@ -163,15 +164,14 @@ export function Intro({ personality, seed }: IntroProps) {
     >
       <div className="w-full min-w-0">
         <p
-          className="fit-text mx-auto mb-3 w-4/5 font-['Collapse'] font-bold uppercase leading-[0.9] tracking-[0.08em] text-midground mix-blend-plus-lighter dark:text-foreground/90"
-          style={
-            { '--fit-text-line-height': '0.9', '--fit-text-max': '8rem', '--fit-text-min': '2.75rem' } as CSSProperties
-          }
+          aria-label={WORDMARK}
+          className="fit-text mx-auto mb-3 w-[88%] font-['Collapse'] font-bold uppercase leading-[0.9] tracking-[0.08em] text-midground mix-blend-plus-lighter dark:text-foreground/90"
+          style={{ '--fit-text-line-height': '0.9', '--fit-text-min': '2.75rem' } as CSSProperties}
         >
           <span>
-            <span>HERMES AGENT</span>
+            <span>{WORDMARK}</span>
           </span>
-          <span aria-hidden="true">HERMES AGENT</span>
+          <span aria-hidden="true">{WORDMARK}</span>
         </p>
 
         <p className="m-0 text-center leading-normal tracking-tight">{copy.body}</p>

apps/desktop/src/components/error-boundary.tsx

@@ -1,7 +1,7 @@
 import { Component, type ErrorInfo, type ReactNode } from 'react'
 
 import { Button } from '@/components/ui/button'
-import { AlertTriangle, RefreshCw } from '@/lib/icons'
+import { ErrorState } from '@/components/ui/error-state'
 
 export interface ErrorBoundaryFallbackProps {
   error: Error
@@ -53,43 +53,25 @@ export class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundarySt
 
 function RootErrorFallback({ error, reset }: ErrorBoundaryFallbackProps) {
   return (
-    <div className="fixed inset-0 z-[1500] flex items-center justify-center bg-(--ui-chat-surface-background) p-6">
-      <div className="w-full max-w-[40rem] overflow-hidden rounded-xl border border-(--ui-stroke-secondary) bg-(--ui-chat-bubble-background) shadow-sm">
-        <div className="flex items-start gap-3 border-b border-(--ui-stroke-tertiary) px-5 py-4">
-          <div className="flex size-9 shrink-0 items-center justify-center rounded-lg bg-destructive/10 text-destructive">
-            <AlertTriangle className="size-5" />
-          </div>
-          <div>
-            <h2 className="text-[0.9375rem] font-semibold tracking-tight">Something broke in the interface</h2>
-            <p className="mt-1 text-[0.8125rem] leading-5 text-(--ui-text-tertiary)">
-              The view hit an unexpected error. Your chats and settings are safe - try again, or reload the window.
-            </p>
-          </div>
-        </div>
-
-        <div className="grid gap-4 p-5">
-          <div className="rounded-md border border-destructive/30 bg-destructive/10 px-4 py-3 font-mono text-[0.7rem] leading-4 text-destructive">
-            {error.message || String(error)}
-          </div>
-
-          <div className="flex flex-wrap items-center gap-2.5">
-            <Button onClick={reset}>
-              <RefreshCw className="size-4" />
-              Try again
-            </Button>
-            <Button onClick={() => window.location.reload()} variant="text">
-              Reload window
-            </Button>
-            <Button
-              className="ml-auto"
-              onClick={() => void window.hermesDesktop?.revealLogs()?.catch(() => undefined)}
-              variant="text"
-            >
-              Open logs
-            </Button>
-          </div>
-        </div>
-      </div>
+    <div className="fixed inset-0 z-[1500] grid place-items-center bg-(--ui-chat-surface-background) p-6">
+      <ErrorState
+        className="w-full max-w-[28rem]"
+        description={error.message || 'The view hit an unexpected error. Your chats and settings are safe.'}
+        title="Something broke in the interface"
+      >
+        <Button className="font-semibold" onClick={reset} size="lg">
+          Try again
+        </Button>
+        <Button onClick={() => window.location.reload()} variant="text">
+          Reload window
+        </Button>
+        <Button
+          onClick={() => void window.hermesDesktop?.revealLogs()?.catch(() => undefined)}
+          variant="text"
+        >
+          Open logs
+        </Button>
+      </ErrorState>
     </div>
   )
 }

apps/desktop/src/components/ui/error-state.tsx

@@ -0,0 +1,45 @@
+import type { ReactNode } from 'react'
+
+import { AlertCircle } from '@/lib/icons'
+import { cn } from '@/lib/utils'
+
+export interface ErrorStateProps {
+  /** Optional actions row/stack rendered below the copy. */
+  children?: ReactNode
+  className?: string
+  description?: ReactNode
+  /** Defaults to a destructive AlertCircle. */
+  icon?: ReactNode
+  title: ReactNode
+}
+
+// Shared, presentation-only error layout: a destructive icon chip over a
+// centered title + body, with an optional actions stack. Used by both the
+// top-level React error boundary and the in-dialog update error so every
+// failure state reads the same. Title/description accept nodes so callers in a
+// Radix Dialog can pass DialogTitle/DialogDescription for accessibility.
+export function ErrorState({ children, className, description, icon, title }: ErrorStateProps) {
+  return (
+    <div className={cn('grid gap-5', className)}>
+      <div className="flex flex-col items-center gap-3 text-center">
+        <span className="flex size-14 items-center justify-center rounded-2xl bg-destructive/10 text-destructive">
+          {icon ?? <AlertCircle className="size-7" />}
+        </span>
+
+        {typeof title === 'string' ? (
+          <h2 className="text-center text-xl font-semibold tracking-tight">{title}</h2>
+        ) : (
+          title
+        )}
+
+        {typeof description === 'string' ? (
+          <p className="max-w-prose text-center text-sm leading-5 text-muted-foreground">{description}</p>
+        ) : (
+          description
+        )}
+      </div>
+
+      {children && <div className="grid gap-2">{children}</div>}
+    </div>
+  )
+}