*{box-sizing:border-box}html{color-scheme:dark;--bg:#050b09;--fg:#b5e4cd;--bright:#c9ffe2;--muted:#56816d;--line:#1b3026;--accent:#6ef2b0;--panel:#07100c;--glow:#70ffb925;--grid:#173321;--hot:#c5f5d9}html[data-theme=paper]{color-scheme:light;--bg:#eaece3;--fg:#293c32;--bright:#17271e;--muted:#788476;--line:#b9c2b5;--accent:#244c39;--panel:#e5e9de;--glow:#192e1710;--grid:#cbd0c5;--hot:#192b21}html[data-theme=graph]{--bg:#0e090c;--fg:#dad6c1;--bright:#f5eed8;--muted:#837b70;--line:#30232b;--accent:#b7e552;--panel:#110d10;--glow:#bbee4020;--grid:#332229;--hot:#f0eabb}html[data-ink=white]{--fg:#d9d6d3;--bright:#f2ece7;--muted:#797b78;--line:#292d2b;--accent:#e1d2da;--glow:#ded0c820;--hot:#fff7ee}html,body{margin:0;width:100%;height:100%;background:var(--bg)}body{font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;color:var(--fg);font-size:10px;overflow:hidden}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}button:focus-visible{outline:1px solid var(--accent);outline-offset:3px}.lab{height:100svh;min-height:520px;display:grid;grid-template-rows:68px minmax(0,1fr) clamp(180px,24vh,250px) 25px;padding:0 16px}.topbar{display:flex;align-items:center;gap:32px;border-bottom:1px solid var(--fg);position:relative}.topbar:after{content:"";position:absolute;bottom:-2px;left:31%;width:16%;height:3px;background:var(--accent);box-shadow:0 0 12px var(--glow)}.identity{flex:none}.identity h1{font-size:18px;font-weight:800;letter-spacing:-.8px;margin:0 0 7px;white-space:nowrap;color:var(--bright)}.identity h1 span{color:var(--muted);padding:0 4px}.identity p{font-size:7px;letter-spacing:.8px;margin:0;color:var(--muted)}.identity p span{padding:0 5px}.metrics{display:flex;justify-content:space-around;gap:28px;flex:1;max-width:590px;margin-left:12px}.metrics div{min-width:42px;display:grid;gap:6px}.metrics span{font-size:8px;letter-spacing:.6px;color:var(--muted)}.metrics b{font-size:13px;font-weight:600}.views{display:flex;gap:4px;margin-left:auto;align-self:stretch;align-items:center}.views button{font-size:8px;letter-spacing:.5px;color:var(--muted);padding:8px 7px;border:1px solid transparent;white-space:nowrap}.views button[aria-pressed=true]{color:var(--bright);border-color:var(--line);background:var(--glow)}.views button:hover{color:var(--bright)}.visual{position:relative;overflow:hidden;min-height:0;border-bottom:1px solid var(--line)}#network{display:block;width:100%;height:100%}.view-label{position:absolute;left:15px;top:16px;font-size:9px;letter-spacing:1px;pointer-events:none;display:flex;align-items:center;gap:7px;background:var(--bg);padding:4px 5px}.view-label small{display:block;color:var(--muted);font-size:7px;letter-spacing:.4px;margin-left:8px}.live-dot,.visual-bottom i{display:inline-block;background:var(--accent);width:4px;height:4px;box-shadow:0 0 7px var(--accent);border-radius:50%}.frame-label{position:absolute;right:15px;top:20px;color:var(--muted);font-size:8px;background:var(--bg);padding:3px}.frame-label span+span{margin-left:18px}.frame-label b{color:var(--fg);font-weight:400}.axis-label{position:absolute;left:5px;top:46%;writing-mode:vertical-rl;font-size:7px;letter-spacing:1px;color:var(--muted);background:var(--bg);padding:6px 1px;transform:rotate(180deg)}.visual-bottom{position:absolute;bottom:8px;left:16px;right:100px;display:flex;justify-content:space-between;pointer-events:none;font-size:7px;letter-spacing:.8px;color:var(--muted)}.visual-bottom i{margin-right:5px}.controls{position:absolute;right:8px;bottom:6px;display:flex;border:1px solid var(--line);background:var(--bg)}.controls button{width:27px;height:24px;font-size:14px;border-left:1px solid var(--line)}.controls button:first-child{border:0}.controls button:hover{background:var(--glow);color:var(--bright)}.telemetry{display:grid;grid-template-columns:1.15fr 1.05fr 1.1fr 1fr;grid-template-rows:1fr 1fr;min-height:0;gap:1px;background:var(--line);border-bottom:1px solid var(--line)}.panel{padding:10px 11px 5px;background:var(--panel);min-width:0;overflow:hidden;position:relative}.panel h2{font-size:7px;font-weight:400;color:var(--muted);margin:0 0 8px;display:flex;align-items:center;gap:7px;white-space:nowrap;line-height:10px}.panel h2 span{color:var(--bright);font-weight:bold;font-size:8px;letter-spacing:.1px}.panel h2 i{font-size:6px;font-style:normal;font-weight:400;color:var(--muted);margin-left:auto}.scope{width:100%;height:calc(100% - 30px);display:block}.log{font-size:6.8px;line-height:8px}.log>div{display:flex;gap:12px;white-space:nowrap}.log time{color:var(--muted)}.log em{font-style:normal;color:var(--accent);width:26px;flex:none}.log span{overflow:hidden;text-overflow:clip;opacity:.8}.log>div:last-child{color:var(--bright);opacity:1}.mini-tabs{display:flex;gap:25px;font-size:6px;margin-top:3px;color:var(--muted)}.mini-tabs span{padding:2px 9px}.mini-tabs .selected{background:var(--accent);color:var(--bg)}.micro-caption{font-size:6px;color:var(--muted);letter-spacing:.3px;margin-top:4px}.code-list{font-size:7px;line-height:8px}.code-list div{display:flex;gap:15px}.code-list span{color:var(--muted)}.code-list b{font-weight:400}.code-list div.active{color:var(--bright);text-shadow:0 0 7px var(--glow)}.route-table{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:5px 18px;font-size:7px}.route-table>span{color:var(--muted);font-size:6px}.route-table .bar{width:100%;height:4px;background:var(--line);display:inline-block;position:relative;margin-top:2px}.route-table .bar:after{content:"";display:block;height:100%;width:var(--fill);background:var(--fg);opacity:.6}.agent-list{display:grid;grid-template-columns:1fr 1fr;column-gap:20px;row-gap:4px;font-size:7px}.agent{display:grid;grid-template-columns:14px 36px 1fr 17px;align-items:center;gap:5px}.agent>span:first-child{color:var(--muted);font-size:6px}.agent label{font-size:7px}.meter{height:5px;background:var(--line);overflow:hidden}.meter b{height:100%;display:block;width:var(--fill);background:repeating-linear-gradient(90deg,var(--fg) 0,var(--fg) 4px,transparent 4px,transparent 5px);opacity:.8;transition:width 1s linear}.agent small{font-size:5px;color:var(--muted)}footer{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--muted);font-size:7px;letter-spacing:.3px}footer .live-dot{width:3px;height:3px;margin-right:5px}.footer-sep{padding:0 9px}.paused .live-dot,.paused .visual-bottom i{box-shadow:none;opacity:.4}noscript{position:absolute;inset:40% 10%;text-align:center;background:var(--bg);font-size:16px;padding:20px}
@media(min-width:1800px){.lab{grid-template-rows:86px minmax(0,1fr) 310px 28px;padding:0 22px}.identity h1{font-size:22px}.metrics b{font-size:16px}.metrics span,.views button{font-size:10px}.panel{padding:12px 16px 7px}.panel h2 span{font-size:10px}.log{font-size:8px;line-height:13px}.code-list{font-size:9px;line-height:12px}.route-table,.agent label{font-size:9px}.agent-list{row-gap:6px}.panel h2{margin-bottom:10px}.mini-tabs,.micro-caption{font-size:7px}}
@media(max-width:1100px){.topbar{gap:15px}.metrics{gap:15px;margin:0}.metrics div:nth-child(n+4){display:none}.views button{padding:8px 5px}.identity h1{font-size:16px}.panel h2 span{font-size:7px}.panel h2 i{display:none}.view-label small{display:none}.agent-list{column-gap:8px}.agent{grid-template-columns:10px 28px 1fr 12px;gap:3px}.route-table{gap:5px 8px}}
@media(max-width:700px){body{overflow-y:auto}.lab{min-height:760px;height:100svh;padding:0 8px;grid-template-rows:92px minmax(260px,1fr) 330px 26px}.topbar{align-content:center;flex-wrap:wrap;gap:0;padding:10px 4px 6px}.identity{width:68%}.identity h1{font-size:16px;margin-bottom:5px}.identity p{font-size:6px;letter-spacing:.25px}.metrics{margin-left:auto;flex:0;width:25%;gap:20px}.metrics div{min-width:0}.metrics div:nth-child(n+3){display:none}.metrics span{font-size:6px}.metrics b{font-size:11px}.views{width:100%;justify-content:flex-start;margin-top:10px;height:20px;gap:16px}.views button{padding:3px 7px;font-size:7px}.topbar:after{left:37%;width:24%}.telemetry{grid-template-columns:1fr 1fr;grid-template-rows:repeat(4,1fr)}.panel{padding:5px 7px 4px}.panel h2{margin-bottom:4px;gap:5px;line-height:8px}.panel h2 span{font-size:6px}.scope{height:calc(100% - 23px)}.log{font-size:5.5px;line-height:7px}.log>div{gap:7px}.code-list{font-size:5.5px;line-height:6.8px}.route-table{font-size:5.5px;gap:3px 8px}.route-table>span{font-size:5px}.agent-list{row-gap:3px}.agent label{font-size:5.5px}.agent small{font-size:4px}.meter{height:4px}.mini-tabs{gap:5px;font-size:4.5px}.mini-tabs span{padding:1px 4px}.micro-caption{font-size:4px;letter-spacing:0}.view-label{font-size:6px;left:8px;top:8px;letter-spacing:.5px}.frame-label{font-size:5px;top:12px;right:5px}.frame-label>span:first-child{display:none}.axis-label{font-size:5px}.visual-bottom{font-size:5px;left:8px;right:82px}.visual-bottom>span:nth-child(2){display:none}.controls button{width:23px;height:21px;font-size:12px}.footer-extra{display:none}footer{font-size:5.5px;letter-spacing:0}.panel:nth-child(3){grid-row:2;grid-column:1}.panel:nth-child(4){grid-row:2;grid-column:2}}
@media(prefers-reduced-motion:reduce){.meter b{transition:none}}

@media(min-width:701px) and (max-height:800px){.panel{padding-top:6px}.panel h2{margin-bottom:5px}.log{font-size:6px;line-height:7px}.code-list{font-size:6px;line-height:7px}.route-table{gap:3px 12px;font-size:6px}.agent-list{row-gap:3px}.micro-caption{font-size:5px}.panel h2 span{font-size:7px}}

/* The inspection controls use the same compact instrument-panel language. */
#network{touch-action:none;cursor:grab;outline:none}#network:focus-visible{outline:1px solid var(--accent);outline-offset:-2px}#network.is-dragging{cursor:grabbing}.visual-bottom{right:auto}.visual-bottom>span:nth-child(2){display:none}.interaction-help{position:absolute;bottom:15px;left:50%;transform:translateX(-50%);font-size:8px;letter-spacing:.4px;color:var(--muted);pointer-events:none;white-space:nowrap}.controls{z-index:5;align-items:center}.controls button{font-size:12px;min-width:29px;width:auto;padding:0 7px;height:28px}.controls #reset-view{font-size:8px;min-width:42px}.controls #speed{font-size:9px;min-width:35px}.control-divider{width:4px;height:17px;background:var(--line);border-left:3px solid var(--bg)}.node-tooltip{position:absolute;z-index:6;pointer-events:none;min-width:125px;max-width:220px;padding:8px 10px;background:var(--bg);border:1px solid var(--muted);box-shadow:0 8px 24px #0005;color:var(--bright)}.node-tooltip b{display:block;font-size:10px;font-weight:500;line-height:1.4}.node-tooltip span{display:block;margin-top:4px;font-size:8px;color:var(--muted)}.inspector{position:absolute;right:14px;top:47px;z-index:4;width:246px;padding:12px 14px;border:1px solid var(--muted);background:var(--bg);box-shadow:0 8px 40px #0005}.inspector-head{display:flex;align-items:center;justify-content:space-between;font-size:7px;color:var(--muted);letter-spacing:.5px}.inspector-head button{font-size:20px;line-height:20px;padding:0 2px;color:var(--fg)}.inspector h2{font-size:14px;margin:13px 0 7px;color:var(--bright);font-weight:500;overflow-wrap:anywhere}.inspector p{font-size:8px;color:var(--muted);margin:0 0 16px}.inspector dl{margin:0;display:flex;justify-content:space-between}.inspector dt{font-size:7px;color:var(--muted);margin-bottom:6px}.inspector dd{margin:0;font-size:16px;font-weight:500}.inspector-meter{height:3px;background:var(--line);margin:13px 0 16px}.inspector-meter i{display:block;height:100%;width:0;background:var(--accent);transition:width .4s}.inspector-actions{display:flex;gap:8px}.inspector-actions button{font-size:9px;flex:1;border:1px solid var(--line);padding:8px 2px;background:var(--glow)}.inspector-actions button:hover{border-color:var(--accent)}.inspector-note{margin-top:12px;color:var(--muted);font-size:7px}.agent{padding:1px 2px;text-align:left;border:1px solid transparent;color:var(--fg)}.agent:hover,.agent[aria-pressed=true]{background:var(--glow);border-color:var(--muted);color:var(--bright)}.agent label{pointer-events:none}.mini-tabs button{font-size:inherit;padding:2px 9px;color:var(--muted)}.mini-tabs button.selected{color:var(--bg)}[hidden]{display:none!important}
@media(max-width:1100px){.interaction-help{left:38%;font-size:7px}.controls button{min-width:25px;padding:0 5px}.inspector{width:215px}.agent{padding:0 1px}}
@media(max-width:700px){.interaction-help{left:13px;top:29px;bottom:auto;transform:none;font-size:6px;letter-spacing:0}.controls{right:4px;bottom:6px}.controls button{height:27px;min-width:25px;padding:0 5px}.controls #reset-view{min-width:36px;font-size:7px}.controls #speed{min-width:28px;font-size:8px}.controls #fullscreen{display:none}.visual-bottom{bottom:16px;font-size:4.5px}.inspector{width:182px;right:6px;top:48px;padding:8px 10px}.inspector-head{font-size:5px}.inspector h2{font-size:11px;margin-top:8px}.inspector p{font-size:6px;margin-bottom:10px}.inspector dd{font-size:13px}.inspector dt{font-size:6px}.inspector-meter{margin:10px 0}.inspector-actions button{font-size:7px;padding:7px 1px}.inspector-note{font-size:5.5px}.node-tooltip{padding:6px 8px;max-width:170px}.node-tooltip b{font-size:8px}.node-tooltip span{font-size:6px}.mini-tabs button{padding:1px 4px}.agent-list{row-gap:2px}}
@media(prefers-reduced-motion:reduce){.inspector-meter i{transition:none}}