| /* 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; | |
| } | |