:root{--bg:#0b1220;--bg-elev:#111a2e;--bg-hover:#16213a;--border:#1f2a44;--text:#e6ebf5;--text-muted:#93a0bd;--accent:#facc15;--accent-dim:#b48a0a;--accent-fg:#1a1a1a;--danger:#ef4444;--warn:#f59e0b;--info:#38bdf8;--success:#22c55e;--debug:#94a3b8;--trace:#64748b;--code-bg:#0a1224;--badge-trace-bg:#1e293b;--badge-debug-bg:#1e293b;--badge-info-bg:#082f49;--badge-warn-bg:#422006;--badge-error-bg:#450a0a;--badge-fatal-bg:#7f1d1d;--badge-fatal-fg:#fecaca;--badge-ok-bg:#052e16;--badge-firing-bg:#450a0a;--badge-resolved-bg:#052e16;--badge-unresolved-bg:#422006;--badge-ignored-bg:#1e293b;--shadow-drawer:-8px 0 32px #0006;font-feature-settings:"ss01", "cv11";--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:-apple-system,BlinkMacSystemFont,Inter,Segoe UI,system-ui,sans-serif}[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}[data-theme=light]{--bg:#f6f8fc;--bg-elev:#fff;--bg-hover:#eef2f8;--border:#d6deea;--text:#1a2233;--text-muted:#56627a;--accent:#b45309;--accent-dim:#92400e;--accent-fg:#fff;--danger:#dc2626;--warn:#b45309;--info:#0369a1;--success:#15803d;--debug:#475569;--trace:#64748b;--code-bg:#f1f5f9;--badge-trace-bg:#e2e8f0;--badge-debug-bg:#e2e8f0;--badge-info-bg:#dbeafe;--badge-warn-bg:#fef3c7;--badge-error-bg:#fee2e2;--badge-fatal-bg:#fecaca;--badge-fatal-fg:#7f1d1d;--badge-ok-bg:#dcfce7;--badge-firing-bg:#fee2e2;--badge-resolved-bg:#dcfce7;--badge-unresolved-bg:#fef3c7;--badge-ignored-bg:#e2e8f0;--shadow-drawer:-8px 0 32px #0f172a1f;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:light){:root:not([data-theme]){--bg:#f6f8fc;--bg-elev:#fff;--bg-hover:#eef2f8;--border:#d6deea;--text:#1a2233;--text-muted:#56627a;--accent:#b45309;--accent-dim:#92400e;--accent-fg:#fff;--danger:#dc2626;--warn:#b45309;--info:#0369a1;--success:#15803d;--debug:#475569;--trace:#64748b;--code-bg:#f1f5f9;--badge-trace-bg:#e2e8f0;--badge-debug-bg:#e2e8f0;--badge-info-bg:#dbeafe;--badge-warn-bg:#fef3c7;--badge-error-bg:#fee2e2;--badge-fatal-bg:#fecaca;--badge-fatal-fg:#7f1d1d;--badge-ok-bg:#dcfce7;--badge-firing-bg:#fee2e2;--badge-resolved-bg:#dcfce7;--badge-unresolved-bg:#fef3c7;--badge-ignored-bg:#e2e8f0;--shadow-drawer:-8px 0 32px #0f172a1f;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--text);min-height:100vh;margin:0;padding:0;font-size:14px;line-height:1.5}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}input,select,textarea{background:var(--bg-elev);border:1px solid var(--border);border-radius:4px;padding:6px 10px}input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:-1px}button{background:var(--bg-elev);border:1px solid var(--border);cursor:pointer;color:var(--text);border-radius:4px;padding:6px 12px;transition:background .1s}button:hover{background:var(--bg-hover)}button.primary{background:var(--accent);color:var(--accent-fg);border-color:var(--accent);font-weight:600}button.primary:hover{background:var(--accent-dim)}button.danger{border-color:var(--danger);color:var(--danger)}code,pre,.mono{font-family:JetBrains Mono,Fira Code,SF Mono,Menlo,Consolas,monospace;font-size:12.5px}pre{background:var(--code-bg);border:1px solid var(--border);border-radius:4px;padding:12px;overflow-x:auto}table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%}table th{text-align:left;color:var(--text-muted);border-bottom:1px solid var(--border);background:var(--bg);z-index:1;padding:8px 10px;font-weight:500;position:sticky;top:0}table td{border-bottom:1px solid var(--border);vertical-align:top;padding:8px 10px}table tr:hover{background:var(--bg-elev)}.layout{grid-template-columns:220px 1fr;min-height:100vh;display:grid}.sidebar{background:var(--bg-elev);border-right:1px solid var(--border);flex-direction:column;height:100vh;padding:16px 0;display:flex;position:sticky;top:0;overflow:hidden}.sidebar nav{scrollbar-width:thin;scrollbar-color:color-mix(in srgb, var(--text-muted) 35%, transparent) transparent;flex:1;min-height:0;overflow:hidden auto}.sidebar nav::-webkit-scrollbar{width:6px}.sidebar nav::-webkit-scrollbar-track{background:0 0}.sidebar nav::-webkit-scrollbar-thumb{background-color:color-mix(in srgb, var(--text-muted) 30%, transparent);border-radius:3px}.sidebar nav::-webkit-scrollbar-thumb:hover{background-color:color-mix(in srgb, var(--text-muted) 60%, transparent)}.sidebar-footer{border-top:1px solid var(--border);flex-shrink:0;padding:12px 16px}.sidebar .brand{letter-spacing:.5px;color:var(--accent);align-items:center;gap:10px;padding:0 16px 16px;font-size:18px;font-weight:700;display:flex}.sidebar .brand-dot{background:var(--accent);width:14px;height:14px;box-shadow:0 0 12px var(--accent);border-radius:50%}.sidebar nav a{color:var(--text);border-left:3px solid #0000;align-items:center;gap:10px;padding:7px 16px;font-size:13.5px;text-decoration:none;display:flex}.sidebar nav a:hover{background:var(--bg-hover);text-decoration:none}.sidebar nav a.active{background:var(--bg-hover);border-left-color:var(--accent);color:var(--accent)}.sidebar nav .nav-icon{opacity:.75;width:16px;height:16px;color:var(--text-muted);flex-shrink:0}.sidebar nav a:hover .nav-icon{opacity:1;color:var(--text)}.sidebar nav a.active .nav-icon{opacity:1;color:var(--accent)}.sidebar nav .nav-section-title{text-transform:uppercase;letter-spacing:.7px;color:var(--text-muted);opacity:.7;padding:14px 16px 4px;font-size:10px}.sidebar nav .nav-section-title:first-child{padding-top:6px}.main{min-width:0;padding:20px 24px}.page-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px;display:flex}.page-title{margin:0;font-size:20px;font-weight:600}.toolbar{flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:12px;display:flex}.cards{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-bottom:20px;display:grid}.card{background:var(--bg-elev);border:1px solid var(--border);border-radius:6px;padding:14px 16px}.card .label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-size:12px}.card .value{font-variant-numeric:tabular-nums;margin-top:4px;font-size:24px;font-weight:600}.badge{text-transform:uppercase;letter-spacing:.5px;border-radius:10px;padding:2px 8px;font-size:11px;font-weight:600;display:inline-block}.badge.trace{background:var(--badge-trace-bg);color:var(--trace)}.badge.debug{background:var(--badge-debug-bg);color:var(--debug)}.badge.info{background:var(--badge-info-bg);color:var(--info)}.badge.warn{background:var(--badge-warn-bg);color:var(--warn)}.badge.error{background:var(--badge-error-bg);color:var(--danger)}.badge.fatal{background:var(--badge-fatal-bg);color:var(--badge-fatal-fg)}.badge.ok{background:var(--badge-ok-bg);color:var(--success)}.badge.firing{background:var(--badge-firing-bg);color:var(--danger)}.badge.resolved{background:var(--badge-resolved-bg);color:var(--success)}.badge.unresolved{background:var(--badge-unresolved-bg);color:var(--warn)}.badge.ignored{background:var(--badge-ignored-bg);color:var(--debug)}.empty{text-align:center;color:var(--text-muted);padding:60px 20px}.log-row{border-bottom:1px solid var(--border);cursor:pointer;grid-template-columns:180px 80px 140px 1fr;align-items:start;gap:12px;padding:6px 8px;font-size:13px;display:grid}.log-row:hover{background:var(--bg-elev)}.log-row .ts{color:var(--text-muted);white-space:nowrap}.log-row .body{white-space:pre-wrap;word-break:break-word;font-family:JetBrains Mono,Menlo,monospace}.flex{display:flex}.gap-8{gap:8px}.gap-12{gap:12px}.gap-16{gap:16px}.between{justify-content:space-between}.center{align-items:center}.muted{color:var(--text-muted)}.tabular{font-variant-numeric:tabular-nums}.grow{flex:1}.mt-8{margin-top:8px}.mt-16{margin-top:16px}.mt-24{margin-top:24px}.drawer{background:var(--bg-elev);border-left:1px solid var(--border);z-index:100;width:min(640px,100vw);height:100vh;box-shadow:var(--shadow-drawer);padding:20px;position:fixed;top:0;right:0;overflow-y:auto}.drawer .close{float:right}.spinner{border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:14px;height:14px;animation:.8s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.skeleton{background:var(--bg-hover);-webkit-user-select:none;user-select:none;color:#0000;border-radius:4px;display:inline-block;position:relative;overflow:hidden}.skeleton:after{content:"";background:linear-gradient(90deg,#0000 0%,#ffffff0d 50%,#0000 100%);animation:1.4s linear infinite skeleton-shimmer;position:absolute;inset:0;transform:translate(-100%)}[data-theme=light] .skeleton:after{background:linear-gradient(90deg,#0000 0%,#ffffff8c 50%,#0000 100%)}@keyframes skeleton-shimmer{to{transform:translate(100%)}}@media (prefers-reduced-motion:reduce){.skeleton:after{animation:none}}.live-dot{background:var(--success);width:8px;height:8px;box-shadow:0 0 8px var(--success);border-radius:50%;animation:1.6s ease-in-out infinite pulse;display:inline-block}@keyframes pulse{50%{opacity:.3}}.field{flex-direction:column;gap:4px;margin-bottom:12px;display:flex}.field label{color:var(--text-muted);font-size:12px}.chart-grid{stroke:var(--border);stroke-width:1px}.chart-line{stroke:var(--accent);stroke-width:1.5px;fill:none}.chart-area{fill:var(--accent);fill-opacity:.15}.chart-axis{fill:var(--text-muted);font-size:10px}.span-bar{background:var(--info);border-radius:2px;height:16px}.span-bar.ERROR{background:var(--danger)}.span-bar.OK{background:var(--success)}.span-row{border-bottom:1px solid var(--border);grid-template-columns:240px 1fr 100px;align-items:center;gap:12px;padding:4px 8px;font-size:12.5px;display:grid}.span-row .span-name{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.span-row .span-track{background:var(--bg);border-radius:2px;height:16px;position:relative}.span-row .span-track .span-bar{position:absolute;top:0;bottom:0}.settings-tabs{border-bottom:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:2px;margin-bottom:24px;display:flex;overflow:hidden}.settings-tabs a{color:var(--text-muted);white-space:nowrap;border-bottom:2px solid #0000;margin-bottom:-1px;padding:10px 14px;font-size:13.5px;font-weight:500;text-decoration:none;transition:color .1s,border-color .1s}.settings-tabs a:hover{color:var(--text);text-decoration:none}.settings-tabs a.active{color:var(--accent);border-bottom-color:var(--accent)}.settings-tabs-divider{background:color-mix(in srgb, var(--text-muted) 50%, transparent);flex-shrink:0;width:1px;height:16px;margin:0 10px;display:inline-block}.settings-content{min-width:0}.theme-segmented{border:1px solid var(--border);background:var(--bg-elev);border-radius:6px;display:inline-flex;overflow:hidden}.theme-segmented button{color:var(--text-muted);cursor:pointer;background:0 0;border:0;border-radius:0;align-items:center;gap:6px;padding:6px 12px;font-size:13px;display:flex}.theme-segmented button:hover{background:var(--bg-hover)}.theme-segmented button.active{background:var(--accent);color:var(--accent-fg);font-weight:600}
