:root{--bg: #0a0a0a;--panel: #111318;--border: #1e2128;--accent: #00ff88;--accent-2: #00d4ff;--warn: #ff9500;--err: #ff2a3d;--text: #e6e8ee;--muted: #6b7280;--mono: "JetBrains Mono", monospace}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--mono);overflow-x:hidden}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:9999;opacity:.04;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(255,255,255,.1) 3px)}h1,h2,h3,h4,h5,h6{letter-spacing:.05em;text-transform:uppercase}button{font-family:var(--mono);cursor:pointer;border-radius:4px;transition:all .2s;padding:8px 16px;border:1px solid var(--border);background:var(--panel);color:var(--text)}button:hover{border-color:var(--accent);color:var(--accent);box-shadow:0 0 10px #0f83}button.btn-primary{background:var(--accent);color:var(--bg);border:none;font-weight:700}button.btn-primary:hover{background:var(--bg);color:var(--accent);border:1px solid var(--accent)}button.btn-danger:hover{border-color:var(--err);color:var(--err)}input,textarea,select{font-family:var(--mono);background:var(--bg);border:1px solid var(--border);color:var(--text);padding:10px;border-radius:4px;width:100%}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 5px #00ff884d}input:focus:after{content:"|";animation:blink 1s step-end infinite}@keyframes blink{50%{opacity:0}}.panel{background:var(--panel);border:1px solid var(--border);border-radius:6px;padding:20px}.status-indicator{display:inline-flex;align-items:center;gap:8px;font-size:.8rem;font-weight:700}.status-dot{width:8px;height:8px;border-radius:50%}.status-connected .status-dot{background:var(--accent);animation:pulse-green 2s infinite}.status-disconnected .status-dot{background:var(--err);animation:pulse-red 2s infinite}.status-connecting .status-dot{background:var(--accent-2);animation:flicker .5s infinite}@keyframes pulse-green{0%,to{opacity:1;box-shadow:0 0 #0f86}50%{opacity:.8;box-shadow:0 0 0 8px #0f80}}@keyframes pulse-red{0%,to{opacity:1;box-shadow:0 0 #ff2a3d66}50%{opacity:.8;box-shadow:0 0 0 8px #ff2a3d00}}@keyframes flicker{0%,to{opacity:1}50%{opacity:.3}}@keyframes glitch{0%{transform:translate(0)}20%{transform:translate(-2px,2px)}40%{transform:translate(-2px,-2px)}60%{transform:translate(2px,2px)}80%{transform:translate(2px,-2px)}to{transform:translate(0)}}.glitch-effect{animation:glitch .15s ease-in-out}.sidebar{position:fixed;left:0;top:0;bottom:0;width:240px;background:var(--panel);border-right:1px solid var(--border);display:flex;flex-direction:column;z-index:100}.sidebar-logo{padding:30px 20px}.logo-text{font-size:1.5rem;color:var(--accent);letter-spacing:.2em;font-weight:700;text-shadow:0 0 10px rgba(0,255,136,.5)}.logo-tagline{font-size:.65rem;color:var(--muted);margin-top:5px}.sidebar-nav{flex:1;padding:20px 0}.nav-link{display:flex;align-items:center;padding:12px 20px;color:var(--muted);text-decoration:none;border-left:2px solid transparent;transition:all .2s;font-size:.9rem}.nav-link:hover{color:var(--text);background:#ffffff08}.nav-link.active{color:var(--accent);background:#00ff880d;border-left-color:var(--accent)}.sidebar-footer{padding:20px;border-top:1px solid var(--border)}.app-container{display:flex;min-height:100vh}.main-content{flex:1;margin-left:240px;padding:80px 20px 20px}.topbar{position:fixed;top:0;right:0;left:240px;height:60px;background:var(--bg);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 30px;z-index:90}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-container{width:90%;max-width:500px;max-height:90vh;overflow-y:auto}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.log-line{font-size:.85rem;margin-bottom:4px;display:flex;gap:10px}.log-ts{color:var(--muted);min-width:70px}.log-id{color:var(--accent-2);min-width:80px}.log-level{text-transform:uppercase;font-weight:700;min-width:50px}.log-info{color:var(--accent-2)}.log-warn{color:var(--warn)}.log-error{color:var(--err)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-bottom:30px}.stat-card{text-align:center}.stat-value{font-size:2rem;color:var(--accent);margin:10px 0}.stat-label{font-size:.75rem;color:var(--muted);text-transform:uppercase}