.websocket-wrapper{max-width:1000px}.feature-card{border:none;box-shadow:0 2px 8px #00000014;transition:box-shadow .3s ease}.feature-card:hover{box-shadow:0 4px 16px #0000001f}.feature-card .card-header{background:linear-gradient(135deg,var(--bi-surface-2) 0%,var(--bi-border) 100%);border-bottom:1px solid var(--bi-border);font-weight:600;color:var(--bi-text)}#connectionStatus{font-size:.875rem;padding:.375rem .75rem}.message-log{max-height:400px;overflow-y:auto;padding:1rem;background:var(--bi-surface-2);min-height:200px}.message-item{margin-bottom:.75rem;padding:.75rem 1rem;border-radius:.5rem;font-family:Consolas,Monaco,monospace;font-size:.875rem;word-break:break-all;animation:fadeIn .3s ease}.message-item:last-child{margin-bottom:0}.message-time{font-size:.75rem;color:var(--bi-text-muted);margin-right:.5rem}.message-sent{background:#d1ecf1;border-left:4px solid #0c5460;color:#0c5460}.message-received{background:#d4edda;border-left:4px solid #155724;color:#155724}.message-system{background:#fff3cd;border-left:4px solid #856404;color:#856404}.message-error{background:#f8d7da;border-left:4px solid #721c24;color:#721c24}.empty-state{text-align:center;padding:3rem 1rem}#errorMsg{font-size:.875rem}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.message-log{max-height:300px}.message-item{padding:.5rem .75rem;font-size:.8125rem}}.message-log::-webkit-scrollbar{width:6px}.message-log::-webkit-scrollbar-track{background:#f1f1f1;border-radius:3px}.message-log::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:3px}.message-log::-webkit-scrollbar-thumb:hover{background:#a1a1a1}html[data-theme=dark] .message-log::-webkit-scrollbar-track{background:var(--bi-surface-2)}
