:root{--bg: #0b0b0b;--panel: #141414;--border: #262626;--text: #d8d8d8;--dim: #6f6f6f;--pink: #d98b97;--teal: #9fc7bf;--fs: clamp(7px, min(.66vw, .95vh), 11px);--gutter: max(8px, .75vw);color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font-family:JetBrains Mono,ui-monospace,Menlo,monospace;font-size:var(--fs)}#app{display:flex;flex-direction:column;min-height:100vh}.hdr{padding:calc(var(--fs) * 1.2) var(--gutter) 0}.hdr-top{display:flex;justify-content:space-between;align-items:flex-start}.title{white-space:nowrap;font-weight:700;font-size:calc(var(--fs) * 2.15);letter-spacing:.03em;color:#ececec;display:flex;align-items:center;gap:.6em}.sub{color:var(--dim);font-size:calc(var(--fs) * .95);letter-spacing:.06em;margin-top:.7em}.pill{font-size:calc(var(--fs) * .95);font-weight:600;letter-spacing:.12em;padding:.25em .7em;border:1px solid #3a3a3a;border-radius:999px;color:#bdbdbd}.pill.live{border-color:#9fc7bf80;color:var(--teal)}.pill.replay{margin-left:1em;white-space:nowrap;border-style:dashed;color:#8a8a8a}.pill.replay[hidden]{display:none}.pill.mock{border-color:#d98b978c;color:var(--pink)}.pill.live.beat{animation:beat .9s ease-out}@keyframes beat{0%{background:#9fc7bf73;color:#0b0b0b}to{background:transparent}}.stats{display:grid;grid-template-columns:repeat(5,1fr);width:65%}.stat-label{color:#5f5f5f;font-size:calc(var(--fs) * .95);letter-spacing:.06em;transition:color .4s}.stat-label.on{color:#d0d0d0}.stat-value{margin-top:.6em;font-size:calc(var(--fs) * 1.5);font-weight:600;color:#cfcfcf;font-variant-numeric:tabular-nums}.stat-value.accent{color:var(--pink)}.segments{display:grid;grid-template-columns:repeat(5,1fr);gap:.4%;margin-top:calc(var(--fs) * .9);padding-bottom:calc(var(--fs) * .6)}.seg{height:3px;background:#262626;overflow:hidden}.seg-fill{height:100%;background:#d9d2c3;transform-origin:left center;transform:scaleX(0)}.scene{position:relative;height:69vh;min-height:320px;overflow:hidden}.scene canvas{display:block}.callout{position:absolute;left:0;top:0;padding:.6em .9em;background:#080808b8;opacity:0;transform:translateY(6px);transition:opacity .6s ease,transform .6s ease;pointer-events:none;white-space:nowrap}.callout.on{opacity:1;transform:none}.callout-title{font-size:calc(var(--fs) * .95);color:#9a9a9a;letter-spacing:.08em}.callout-detail{margin-top:.7em;font-size:calc(var(--fs) * 1.45);color:#e8e8e8}.panels{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gutter);padding:var(--gutter)}.panel{background:var(--panel);border:1px solid var(--border);padding:1.1em 1.2em .9em;display:flex;flex-direction:column;min-width:0}.panel-title{font-weight:700;font-size:calc(var(--fs) * 1.15);letter-spacing:.05em;color:#e4e4e4;margin-bottom:1.1em}.panel-body{flex:1;line-height:1.55;min-width:0}.panel-foot{color:#8c8c8c;margin-top:.8em;white-space:pre-line;line-height:1.6}.panel-foot:empty{display:none}.panel-field .panel-foot:first-line{color:#cfcfcf}canvas.fit{display:block;width:100%}.feed-row{display:grid;grid-template-columns:4ch 8ch minmax(0,1fr);color:#a3a3a3;height:1.55em}.feed-row span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.c-n{color:#6b6b6b}.c-d{color:#8d8d8d}.c-d.pink{color:#b98a92}.feed-row.newest{color:#f2f2f2;font-weight:700}canvas.flow{height:9em}.tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:.8em;margin-top:1em}.tab{background:#1a1a1a;color:#5f5f5f;padding:.25em .8em;transition:background .25s,color .25s}.tab.on{background:#353535;color:#d8d8d8}.ws-row{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;height:1.55em;color:#d6d6d6}.ws-row .ln{color:#6b6b6b;display:inline-block;width:5ch}.cursor{display:inline-block;width:.6em;height:1.1em;vertical-align:-.2em;background:#e8e8e8;animation:blink 1s steps(1) infinite}@keyframes blink{50%{opacity:0}}canvas.field{height:12.5em}.routes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:1.2em;row-gap:.45em}.rt-h{color:#a5a5a5;margin-bottom:.4em}.rt-h.pink{color:var(--pink)}.rt-c{color:#8a8a8a;padding:0 .5em;height:1.8em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative}.rt-c.lit{background:#262626;color:#c9c9c9}.rt-c.replay{animation:replay 1.6s ease-out both}@keyframes replay{0%{background:transparent}12%{background:#5a5a5a;color:#fff}to{background:#2a2a2a;color:#e0e0e0}}.rt-c.replay:after{content:"";position:absolute;left:.5em;bottom:0;height:2px;width:1.6em;background:#e6e6e6;animation:tracer 1.6s ease-out both;animation-delay:inherit}@keyframes tracer{0%{transform:translate(0);opacity:1}to{transform:translate(3em);opacity:0}}canvas.samples{height:13em}.lanes{display:grid;grid-template-columns:1fr 1fr;column-gap:1.5em;row-gap:.15em}.lane{display:grid;grid-template-columns:3.2ch 7.5ch minmax(0,1fr);align-items:start;color:#bdbdbd}.lane .ln{color:#7a7a7a}.lane-name.bold{font-weight:700;color:#fff}.lane-bar{display:grid;grid-template-columns:repeat(8,1fr);gap:1px;height:1.05em;margin-top:.35em;width:85%}.lseg{background:#262626;transition:background .3s}.lseg.on{background:#c3d2ce}.lseg.on.dim{background:#5a6260}.lseg.hot{background:var(--pink)}.lane-sub{font-size:calc(var(--fs) * .85);color:#6d6d6d;display:flex;gap:1.4em;line-height:1.6}.lane-status.working{color:#8f8f8f}.lane-status.dispatch{color:var(--pink);font-weight:700}.ix-row{display:grid;grid-template-columns:10ch minmax(0,1fr) 5ch;align-items:center;height:1.5em;color:#9b9b9b;padding:0 .3em}.ix-head{color:#6e6e6e}.ix-row.sel{background:#262626;color:#f0f0f0}.ix-k{white-space:nowrap;overflow:hidden}.ix-cells{display:grid;grid-template-columns:repeat(14,1fr);gap:.35em;padding-right:1em}.ix-c{display:block;height:.85em}.ix-c.l0{background:transparent}.ix-c.l1{background:#2b2b2b}.ix-c.l2{background:#555}.ix-c.l3{background:#8a8a8a}.ix-c.l4{background:#bdbdbd}.ix-c.l5{background:#f0f0f0}.ix-c.pink{background:var(--pink)}.ix-s{text-align:right}.ix-s.live{color:#d8d8d8}.ix-s.new{color:var(--pink)}.ix-s.idle{color:#6a6a6a}.fps{position:fixed;top:6px;right:8px;z-index:10;font-size:11px;color:#9fc7bf;background:#000000b3;padding:2px 6px}@media(min-width:900px)and (min-aspect-ratio:1/1){#app{height:100vh;height:100dvh;min-height:0;overflow:hidden}.scene{flex:1;height:auto;min-height:0}.panels{flex:none;height:36vh;grid-template-rows:repeat(2,minmax(0,1fr));padding-top:calc(var(--gutter) * .75)}.panel{min-height:0;overflow:hidden;padding:.9em 1.1em .7em}.panel-title{margin-bottom:.7em}.panel-body{display:flex;flex-direction:column;min-height:0;overflow:hidden}.panel-foot{margin-top:.5em}.panel-feed .panel-body,.panel-workspace .panel-body{justify-content:flex-end;-webkit-mask-image:linear-gradient(to bottom,transparent,#000 1.6em);mask-image:linear-gradient(to bottom,transparent,#000 1.6em)}.feed-row,.ws-row{flex:none}.lane-sub{display:none}.lanes{flex:1;min-height:0;grid-template-rows:repeat(6,minmax(0,1fr));row-gap:0}.lane{align-items:center}.lane-bar{margin-top:0}canvas.flow,canvas.field,canvas.samples{flex:1 1 0;min-height:0;height:0}}@media(prefers-reduced-motion:reduce){.cursor,.pill.live.beat,.rt-c.replay,.rt-c.replay:after{animation:none}}