feat: scoped error fallback, pause notice, theme key fallback and OG locale

app/layout.tsx

@@ -17,6 +17,7 @@ export const metadata: Metadata = {
     siteName:    'Conduit',
     images: [{ url: '/og-image.svg', width: 1200, height: 630, alt: 'Conduit — Streaming Payments on Stellar' }],
     type:        'website',
+    locale:      'en_US',
   },
   twitter: {
     card:        'summary_large_image',

components/CircuitBreakerOverlay.tsx

@@ -49,6 +49,9 @@ export function CircuitBreakerOverlay() {
   return (
     <div className="fixed bottom-4 right-4 z-50 max-w-sm rounded-lg border border-yellow-400/50 bg-yellow-50 p-3 text-xs shadow-lg dark:border-yellow-600/50 dark:bg-yellow-950/90 dark:text-yellow-100">
       <div className="mb-2 font-semibold">Circuit Breaker Monitor</div>
+      <p className="mb-2 text-[11px] opacity-80">
+        Some actions are paused while the network recovers. They resume automatically.
+      </p>
       <ul className="space-y-1.5">
         {states.map((s) => {
           const seconds = Math.ceil(s.remainingMs / 1000);

components/ErrorBoundary.tsx

@@ -122,7 +122,8 @@ export class ErrorBoundary extends Component<Props, State> {
         return this.props.fallback(this.state.error!, this.retry, this.reset);
       }
 
-      return React.createElement('div', { className: 'flex items-center justify-center min-h-[200px]' },
+      // Scoped to this boundary, so wrapping a single stream card keeps the rest of the page usable.
+      return React.createElement('div', { role: 'alert', className: 'flex items-center justify-center min-h-[200px]' },
         React.createElement('div', { className: 'text-center p-6 max-w-md' },
           React.createElement('h2', { className: 'text-lg font-semibold text-gray-700 dark:text-gray-300 mb-2' }, 'Something went wrong'),
           React.createElement('p', { className: 'text-sm text-gray-500 dark:text-gray-400 mb-4' }, this.state.error?.message || 'An unexpected error occurred.'),

components/ThemeToggle.tsx

@@ -25,7 +25,10 @@ export function ThemeToggle() {
   useEffect(() => {
     setMounted(true);
     try {
-      const stored = localStorage.getItem(THEME_STORAGE_KEY) || localStorage.getItem('theme');
+      const stored =
+        localStorage.getItem(THEME_STORAGE_KEY) ||
+        localStorage.getItem('conduit-theme') ||
+        localStorage.getItem('theme');
       if (stored && (stored === 'light' || stored === 'dark' || stored === 'system') && stored !== theme) {
         setTheme(stored);
       }