:root{--color-bg: hsl(250, 24%, 9%);--color-bg-secondary: hsl(250, 21%, 11%);--color-bg-tertiary: hsl(248, 21%, 13%);--color-bg-elevated: hsl(246, 18%, 15%);--color-gray-50: hsl(248, 21%, 13%);--color-gray-100: hsl(246, 18%, 15%);--color-gray-200: hsl(246, 11%, 22%);--color-gray-300: hsl(246, 8%, 32%);--color-gray-400: hsl(245, 6%, 45%);--color-gray-500: hsl(244, 5%, 58%);--color-gray-600: hsl(243, 5%, 70%);--color-gray-700: hsl(242, 8%, 82%);--color-gray-800: hsl(240, 12%, 91%);--color-gray-900: hsl(0, 0%, 97%);--color-fg: hsl(0, 0%, 100%);--color-fg-muted: hsl(244, 5%, 65%);--color-fg-subtle: hsl(246, 6%, 45%);--color-brand: hsl(255, 85%, 70%);--color-brand-dim: hsl(255, 50%, 55%);--color-brand-subtle: hsl(255, 35%, 20%);--color-success: hsl(148, 55%, 52%);--color-success-subtle: hsl(148, 40%, 12%);--color-danger: hsl(0, 70%, 60%);--color-danger-subtle: hsl(0, 50%, 12%);--color-warning: hsl(38, 95%, 58%);--color-warning-subtle: hsl(38, 60%, 12%);--color-info: hsl(210, 85%, 62%);--color-info-subtle: hsl(210, 55%, 12%);--color-border: hsl(246, 11%, 20%);--color-border-muted: hsl(246, 11%, 16%);--color-border-focus: var(--color-brand);--font-sans: "Inter", system-ui, -apple-system, sans-serif;--font-serif: "IBM Plex Serif", Georgia, serif;--font-mono: "IBM Plex Mono", "Menlo", "Consolas", monospace;--text-xs: .6875rem;--text-sm: .75rem;--text-base: .875rem;--text-lg: 1rem;--text-xl: 1.125rem;--text-2xl: 1.25rem;--text-3xl: 1.5rem;--text-4xl: 2rem;--leading-tight: 1.2;--leading-snug: 1.35;--leading-normal: 1.5;--leading-relaxed: 1.65;--weight-normal: 400;--weight-medium: 500;--weight-semibold: 600;--weight-bold: 700;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--radius-xl: 12px;--radius-full: 9999px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .5);--shadow-md: 0 2px 8px rgba(0, 0, 0, .6);--shadow-lg: 0 4px 24px rgba(0, 0, 0, .7);--transition-fast: 80ms ease;--transition-normal: .15s ease}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{height:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{height:100%;font-family:var(--font-sans);font-size:var(--text-base);font-weight:var(--weight-normal);line-height:var(--leading-normal);background-color:var(--color-bg);color:var(--color-fg)}#root{height:100%}h1,h2,h3,h4,h5,h6{font-family:var(--font-serif);font-weight:var(--weight-semibold);line-height:var(--leading-tight);color:var(--color-fg)}code,kbd,pre{font-family:var(--font-mono)}.message-list{list-style:none}.message-item{display:grid;grid-template-columns:40px 1fr;align-items:flex-start;gap:var(--space-3);padding:var(--space-3) var(--space-6) var(--space-1);border-radius:var(--radius-md);transition:background-color var(--transition-fast)}.message-item:hover{background-color:var(--color-bg-secondary)}.message-item--grouped{padding-top:2px;padding-bottom:2px}.message-item__avatar{border-radius:var(--radius-full);object-fit:cover;flex-shrink:0;margin-top:2px;box-shadow:var(--shadow-sm)}.message-item__time-gutter{display:flex;align-items:center;justify-content:flex-end;font-size:var(--text-xs);color:transparent;white-space:nowrap;line-height:var(--leading-normal);padding-top:.2em;-webkit-user-select:none;user-select:none;transition:color var(--transition-normal)}.message-item:hover .message-item__time-gutter{color:var(--color-fg-subtle)}.message-item__meta{display:flex;align-items:baseline;gap:var(--space-2);margin-bottom:var(--space-1)}.message-item__author{font-weight:var(--weight-semibold);font-size:var(--text-lg);color:var(--color-fg)}.message-item__username,.message-item__timestamp{font-size:var(--text-xs);color:var(--color-fg-subtle)}.message-item__content{font-size:var(--text-lg);line-height:var(--leading-relaxed);color:var(--color-fg-muted);word-break:break-word}.message-item__content p{margin-bottom:var(--space-2)}.message-item__content p:last-child{margin-bottom:0}.message-item__content strong{font-weight:var(--weight-semibold);color:var(--color-fg)}.message-item__content em{font-style:italic}.message-item__content code{font-family:var(--font-mono);font-size:.875em;background-color:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:.1em .3em}.message-item__content pre{background-color:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);overflow-x:auto;margin:var(--space-2) 0}.message-item__content pre code{background:none;border:none;padding:0;font-size:var(--text-sm)}.message-item__content blockquote{border-left:3px solid var(--color-border);padding-left:var(--space-3);color:var(--color-fg-subtle);margin:var(--space-2) 0}.message-item__content a{color:var(--color-brand);text-decoration:none}.message-item__content a:hover{text-decoration:underline}.message-item__content__status{font-size:var(--text-xs);line-height:var(--leading-normal);color:var(--color-fg-subtle);margin-top:var(--space-1)}.message-item__attachments{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-2)}.message-item__attachment-link{display:inline-block;border-radius:var(--radius-md);overflow:hidden;line-height:0}.message-item__attachment-image{display:block;max-width:400px;max-height:300px;width:100%;height:auto;border-radius:var(--radius-md);border:1px solid var(--color-border);object-fit:cover;transition:opacity var(--transition-fast)}.message-item__attachment-image:hover{opacity:.9}.message-item__attachment-file{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);color:var(--color-brand);background-color:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);text-decoration:none;transition:background-color var(--transition-fast)}.message-item__attachment-file:hover{background-color:var(--color-bg-tertiary)}.app{display:flex;flex-direction:column;height:100%;max-width:860px;margin:0 auto;border-left:1px solid var(--color-border-muted);border-right:1px solid var(--color-border-muted)}.app-header{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4) var(--space-6);border-bottom:1px solid var(--color-border);background-color:var(--color-bg);position:sticky;top:0;z-index:10;flex-shrink:0}.app-header h1{font-family:var(--font-serif);font-size:var(--text-xl);font-weight:var(--weight-semibold);color:var(--color-fg);letter-spacing:-.01em}.status-badge{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--color-fg-muted);background-color:var(--color-bg-tertiary);border:1px solid var(--color-border);border-radius:var(--radius-full);padding:var(--space-1) var(--space-3);margin-left:auto}.status-badge__dot{width:6px;height:6px;border-radius:var(--radius-full);background-color:var(--color-fg-subtle);flex-shrink:0}.status-badge__dot--connected{background-color:var(--color-success);box-shadow:0 0 6px var(--color-success);animation:pulse 1.5s ease-in-out linear}.status-badge__dot--recycling{background-color:var(--color-warning);animation:pulse 1s ease-in-out infinite}.status-badge__dot--error{background-color:var(--color-danger)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.app-feed{flex:1;overflow-y:auto;padding:var(--space-4) 0 var(--space-8);scrollbar-width:thin;scrollbar-color:var(--color-gray-200) transparent}.app-feed::-webkit-scrollbar{width:6px}.app-feed::-webkit-scrollbar-track{background:transparent}.app-feed::-webkit-scrollbar-thumb{background-color:var(--color-gray-200);border-radius:var(--radius-full)}.state-message{display:flex;align-items:center;justify-content:center;padding:var(--space-10) var(--space-6);font-size:var(--text-sm);color:var(--color-fg-subtle)}.error-banner{margin:var(--space-4) var(--space-6);padding:var(--space-3) var(--space-4);background-color:var(--color-danger-subtle);border:1px solid var(--color-danger);border-radius:var(--radius-lg);font-size:var(--text-sm);color:var(--color-danger)}