:root{--bg:#0e1116;--panel:#151a22;--panel-2:#1c2230;--text:#e6e9ef;--text-dim:#8b95a7;--border:#232a38;--ok:#2ecc71;--warn:#f1c40f;--bad:#e74c3c;--bad-bg:rgba(231,76,60,.12);--bad-border:rgba(231,76,60,.55);--accent:#5b8def}*{box-sizing:border-box}body,html{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Inter,sans-serif;font-size:14px}header.topbar{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;background:var(--panel);border-bottom:1px solid var(--border);position:-webkit-sticky;position:sticky;top:0;z-index:10}header.topbar h1{margin:0;font-size:16px;font-weight:600}.status-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:12px;background:var(--panel-2);border:1px solid var(--border)}.status-pill .dot{width:8px;height:8px;border-radius:50%;background:var(--text-dim)}.status-pill.live .dot{background:var(--ok);box-shadow:0 0 6px var(--ok)}.status-pill.err .dot{background:var(--bad)}.summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-gap:12px;gap:12px;padding:16px 20px 0}.card{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:14px 16px}.card .label{color:var(--text-dim);font-size:12px;text-transform:uppercase;letter-spacing:.04em}.card .value{font-size:22px;font-weight:600;margin-top:4px}.card.bad .value{color:var(--bad)}.card.warn .value{color:var(--warn)}.card.ok .value{color:var(--ok)}.table-wrap{margin:16px 20px 24px;background:var(--panel);border:1px solid var(--border);border-radius:10px;overflow:hidden}table.calls{width:100%;border-collapse:collapse;font-size:13px}table.calls td,table.calls th{padding:10px 12px;text-align:left;border-bottom:1px solid var(--border);white-space:nowrap}table.calls th{background:var(--panel-2);color:var(--text-dim);font-weight:500;font-size:11px;text-transform:uppercase;letter-spacing:.05em}table.calls tr:hover{background:hsla(0,0%,100%,.02);cursor:pointer}table.calls tr.bad{background:var(--bad-bg);border-left:3px solid var(--bad-border)}table.calls tr.bad td:first-child{font-weight:600;color:var(--bad)}.tags{gap:6px;flex-wrap:wrap}.tag,.tags{display:inline-flex}.tag{align-items:center;padding:2px 8px;border-radius:999px;font-size:11px;background:hsla(0,0%,100%,.05);border:1px solid var(--border)}.tag.bad{background:rgba(231,76,60,.18);border-color:var(--bad-border);color:#ffb4ad}.tag.ok{background:rgba(46,204,113,.15);border-color:rgba(46,204,113,.5);color:#a6e8c1}.drawer-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:20}.drawer{position:fixed;top:0;right:0;width:min(640px,100vw);height:100vh;background:var(--panel);border-left:1px solid var(--border);z-index:21;display:flex;flex-direction:column}.drawer header{padding:14px 18px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center}.drawer header h2{margin:0;font-size:14px}.drawer .body{padding:14px 18px;overflow-y:auto;font-size:12px}.drawer .body h3{font-size:12px;text-transform:uppercase;color:var(--text-dim);letter-spacing:.04em;margin:18px 0 6px}.drawer pre{background:var(--panel-2);border:1px solid var(--border);border-radius:6px;padding:10px;overflow-x:auto;font-size:11px;line-height:1.45;white-space:pre-wrap;word-break:break-all}.kv{display:grid;grid-template-columns:140px 1fr;grid-row-gap:4px;row-gap:4px;grid-column-gap:12px;column-gap:12px}.kv .k{color:var(--text-dim)}button.close{background:transparent;border:1px solid var(--border);color:var(--text);padding:4px 10px;border-radius:6px;cursor:pointer}button.close:hover{background:var(--panel-2)}.toolbar{display:flex;gap:10px;align-items:center;padding:0 20px;margin-top:12px}.toolbar input,.toolbar select{background:var(--panel-2);border:1px solid var(--border);color:var(--text);padding:6px 10px;border-radius:6px;font-size:12px}