@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap";:root{--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"JetBrains Mono", monospace;--bg-primary:#f8fafc;--bg-secondary:#fff;--card-bg:#fff;--card-border:#e2e8f0;--text-primary:#0f172a;--text-secondary:#475569;--text-muted:#94a3b8;--accent-indigo:#4f46e5;--accent-indigo-bg:#e0e7ff;--accent-slate:#0f172a;--accent-slate-bg:#f1f5f9;--accent-green:#059669;--accent-green-bg:#d1fae5;--accent-red:#dc2626;--accent-red-bg:#fee2e2;--accent-blue:#2563eb;--accent-blue-bg:#dbeafe;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000000d, 0 2px 4px -1px #00000005;--shadow-lg:0 10px 15px -3px #0000000d, 0 4px 6px -2px #00000005;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;background:var(--bg-primary);color:var(--text-primary);font-size:16px;line-height:1.5;font-family:var(--font-sans)}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-primary);justify-content:center;align-items:center;min-height:100vh;display:flex;overflow-x:hidden}#root{width:100%;max-width:900px;margin:0 auto;padding:2.5rem 1.5rem}.app-container{flex-direction:column;gap:2rem;animation:.5s ease-out fadeIn;display:flex}header{text-align:left;border-bottom:1px solid var(--card-border);margin-bottom:.5rem;padding-bottom:1.5rem}.title-container{align-items:center;gap:.75rem;margin-bottom:.25rem;display:flex}.logo-icon{background:var(--accent-slate);color:#fff;border-radius:.5rem;justify-content:center;align-items:center;width:2rem;height:2rem;font-size:1.1rem;font-weight:700;display:flex}h1{color:var(--text-primary);letter-spacing:-.03em;font-size:1.75rem;font-weight:700}.subtitle{color:var(--text-secondary);font-size:.95rem;font-weight:400}.cards-grid{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.5rem;width:100%;display:grid}.card{background:var(--card-bg);border:1px solid var(--card-border);box-shadow:var(--shadow-sm);border-radius:.75rem;flex-direction:column;gap:1.25rem;padding:1.75rem;transition:all .2s;display:flex}.card:hover{box-shadow:var(--shadow-md);border-color:#cbd5e1;transform:translateY(-2px)}.card-header{justify-content:space-between;align-items:center;display:flex}.card-title{color:var(--text-primary);letter-spacing:-.02em;font-size:1.1rem;font-weight:600}.status-badge{text-transform:uppercase;letter-spacing:.02em;border-radius:.375rem;align-items:center;gap:.4rem;padding:.25rem .6rem;font-size:.75rem;font-weight:600;display:flex}.status-dot{border-radius:50%;width:6px;height:6px;display:inline-block}.status-badge.connected .status-dot,.status-badge.active .status-dot{background-color:var(--accent-green)}.status-badge.connected{color:var(--accent-green);background:var(--accent-green-bg)}.status-badge.active{color:var(--accent-indigo);background:var(--accent-indigo-bg)}.status-badge.loading .status-dot{background-color:var(--accent-blue);animation:1s infinite alternate pulse}.status-badge.loading{color:var(--accent-blue);background:var(--accent-blue-bg)}.status-badge.error .status-dot{background-color:var(--accent-red)}.status-badge.error{color:var(--accent-red);background:var(--accent-red-bg)}.version-display{flex-direction:column;gap:.125rem;display:flex}.version-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.75rem;font-weight:500}.version-value{font-size:2.25rem;font-weight:700;font-family:var(--font-mono);color:var(--text-primary);letter-spacing:-.02em}.spec-list{flex-wrap:wrap;gap:.4rem;list-style:none;display:flex}.spec-item{font-size:.75rem;font-family:var(--font-mono);background:var(--accent-slate-bg);color:var(--text-secondary);border:1px solid #00000008;border-radius:.25rem;padding:.15rem .45rem}.panel{background:var(--card-bg);border:1px solid var(--card-border);box-shadow:var(--shadow-sm);border-radius:.75rem;flex-direction:column;gap:1.25rem;padding:1.5rem;display:flex}.panel-header{border-bottom:1px solid var(--card-border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;padding-bottom:1rem;display:flex}.panel-title{align-items:center;gap:.5rem;display:flex}.panel-title h2{color:var(--text-primary);font-size:1.1rem;font-weight:600}.pulse-indicator{background-color:var(--accent-indigo);border-radius:50%;width:8px;height:8px}.latency-display{color:var(--text-secondary);font-size:.8rem;font-family:var(--font-mono);background:var(--accent-slate-bg);border-radius:.25rem;padding:.25rem .5rem}.btn-refresh{background:var(--accent-slate);border:1px solid var(--accent-slate);color:#fff;font-family:var(--font-sans);cursor:pointer;border-radius:.375rem;align-items:center;gap:.4rem;padding:.45rem 1rem;font-size:.85rem;font-weight:500;transition:all .15s;display:flex}.btn-refresh:hover:not(:disabled){background:#334155;border-color:#334155}.btn-refresh:active:not(:disabled){transform:translateY(1px)}.btn-refresh:disabled{opacity:.6;cursor:not-allowed}.console-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.25rem;display:grid}.console-box{border:1px solid var(--card-border);background:#fafafa;border-radius:.5rem;flex-direction:column;gap:.5rem;padding:1rem;display:flex}.console-label{text-transform:uppercase;letter-spacing:.05em;color:var(--text-secondary);border-bottom:1px solid var(--card-border);padding-bottom:.35rem;font-size:.7rem;font-weight:600}.console-content{font-family:var(--font-mono);white-space:pre-wrap;color:#334155;height:120px;font-size:.775rem;line-height:1.5;overflow-y:auto}.console-content.logs{color:#4f46e5}.console-content::-webkit-scrollbar{width:4px}.console-content::-webkit-scrollbar-track{background:0 0}.console-content::-webkit-scrollbar-thumb{background:#00000014;border-radius:2px}footer{text-align:center;color:var(--text-muted);margin-top:1rem;font-size:.8rem}footer a{color:var(--text-secondary);font-weight:500;text-decoration:none}footer a:hover{color:var(--accent-indigo);text-decoration:underline}@keyframes fadeIn{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%{opacity:.4}to{opacity:1}}@media (width<=640px){#root{padding:1.5rem 1rem}.cards-grid{grid-template-columns:1fr}}