:root{--bg:#0f1115;--panel:#171a21;--line:#262b35;--text:#e6e9ef;--muted:#8b93a3;--err:#ff5d5d;--svc-color:var(--text)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:.875rem/1.4 ui-sans-serif,system-ui,-apple-system,sans-serif}.mono{font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:.75rem}.app{display:flex;flex-direction:column;height:100vh}header{display:flex;align-items:center;gap:1rem;padding:0 1.25rem;height:52px;border-bottom:1px solid var(--line);background:var(--panel)}.header-brand{display:flex;align-items:center;gap:.625rem}.header-logo{height:28px;width:auto;filter:brightness(0) invert(1)}header h1{font-size:1.0625rem;font-weight:700;margin:0 0 0 1rem;letter-spacing:-.01em}header select{background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:.375rem;padding:.3125rem .625rem;font-size:.8125rem}.drop{margin:auto;width:min(560px,80%);padding:3rem;text-align:center;border:2px dashed var(--line);border-radius:.75rem;cursor:pointer}.drop.drag{border-color:#4f8cff;background:#141a24}.drop .hint{color:var(--muted);font-size:.75rem}.warn{background:#3a2a12;color:#ffce8a;padding:.375rem 1rem;font-size:.75rem}.main{flex:1;display:grid;overflow:hidden}.left{overflow:auto}.divider{cursor:col-resize;background:var(--line);transition:background .1s}.divider:hover,.divider:active{background:#4f8cff}.right{overflow:auto;background:var(--panel)}.trace-summary{padding:.75rem 1rem;border-bottom:2px solid var(--line);background:var(--panel)}.ts-top{display:flex;align-items:baseline;gap:.75rem;margin-bottom:.625rem}.ts-status{font-size:.625rem;font-weight:700;letter-spacing:.06em;padding:2px .375rem;border-radius:3px;flex-shrink:0}.ts-status--ok{background:#1a3a2a;color:#22b07d}.ts-status--err{background:#3a1a1a;color:var(--err)}.ts-root-name{font-size:1rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}.ts-duration{font-size:.875rem;color:var(--muted);flex-shrink:0}.ts-stats{display:flex;flex-wrap:wrap;gap:.25rem 1.5rem}.ts-stat{display:flex;flex-direction:column;gap:.125rem;min-width:0}.ts-stat dt{font-size:.625rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}.ts-stat dd{margin:0;font-size:.8125rem}.ts-stat--err dd{color:var(--err);font-weight:600}.ts-stat--services dd{display:flex;flex-wrap:wrap;gap:.375rem}.ts-svc{font-size:.75rem;font-weight:600;color:var(--svc-color, var(--text))}.ts-svc:before{content:"●";margin-right:.25rem;font-size:.625rem}.waterfall{font-size:.8125rem}.wf-row{display:grid;grid-template-columns:460px 1fr;align-items:center;border-bottom:1px solid var(--line);cursor:pointer;height:34px}.wf-row:hover{background:#1b1f28}.wf-row.selected{background:#1d2533}.wf-label{display:flex;gap:.5rem;align-items:center;white-space:nowrap;overflow:hidden}.wf-svc{font-size:.6875rem;font-weight:600}.wf-kind{font-size:.625rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--bg);background:var(--muted);border-radius:3px;padding:1px .25rem;flex-shrink:0}.wf-name{color:var(--text);text-overflow:ellipsis;overflow:hidden}.wf-err{color:var(--err)}.wf-track{position:relative;height:100%;margin-right:.5rem}.wf-bar{position:absolute;top:10px;height:14px;border-radius:3px;min-width:2px}.wf-dur{position:absolute;right:0;top:9px;font-size:.6875rem;color:var(--muted)}.detail{padding:1rem}.detail.empty{color:var(--muted)}.detail h3{margin:0 0 .75rem;font-size:.875rem}.detail h4{margin:1rem 0 .375rem;font-size:.75rem;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.kv{margin:0;display:grid;grid-template-columns:auto 1fr;gap:.125rem .75rem}.kv-row{display:contents}.kv dt{color:var(--muted)}.kv dd{margin:0;word-break:break-all}.kv dd.err{color:var(--err)}.events{margin:0;padding-left:1rem}footer{display:flex;gap:1rem;align-items:center;padding:.5rem 1rem;border-top:1px solid var(--line);font-size:.75rem}footer button{background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:.375rem;padding:.4375rem 1rem;cursor:pointer;font-size:.8125rem}footer .src{color:var(--muted)}