web/src/shell/errorBoundary.css

/* shell/errorBoundary.css — WAVE 30 item 2 (R5): the contained-failure card.
   New classes only, co-located with the component that imports them, following
   `shell/navExtras.css`'s precedent — the shell's own rail and placeholder classes
   stay in index.css untouched (that file is another session's fence this wave).

   ⚠ Font sizes are tokens, never literals: `verify_ui.py`'s R5 sweep reads EVERY
   stylesheet under `src/`, not just index.css. */

/* The tone strip is the whole point of this rule. `.shell-placeholder` already
   centres a heading, a sentence and a retry button — that is what the nav-failed
   and data-error cards look like, and both of those mean "it did not load". This
   one means "it broke", and a reader who cannot tell those apart reports the wrong
   thing. The strip takes the `-deep` weight because it reads as a stroke
   (DESIGN.md: strokes and text take `-deep`, flat surfaces take the pastel base). */
.shell-crash {
  border-left: 3px solid var(--lp-red-deep);
  background: var(--lp-red-tint);
  border-radius: var(--lp-r-lg);
  /* Contained, so a long message cannot push the sidebar off-screen — the failure
     panel must never be the second way this surface breaks the app. */
  max-width: 640px;
  margin: 24px;
}

/* The thrown message, verbatim. Monospace because it is a machine's words, not
   ours, and a reader pasting it back to us should be able to see where it ends. */
.shell-crash-detail {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: var(--lp-fs-2xs);
  color: var(--lp-red-deep);
  overflow-wrap: anywhere;
}