body{background:#fdfefb}main{width:100%;height:100dvh;min-height:560px;padding:26px 34px;display:flex;flex-direction:column}header{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}.source-links p{font-size:10px;color:#92988d}.source-links a{color:#737d6d}nav{display:flex;flex-direction:column;align-items:flex-end;gap:6px;font-size:11px;color:#6b7964}#connection{font-size:10px;color:#92988d}.canvas{flex:1;overflow:auto;position:relative;scrollbar-width:thin;scrollbar-color:#dce2d6 transparent;min-height:400px}#tree{position:relative;min-width:100%;min-height:100%}#edges{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.block{position:absolute;width:166px;border:1px solid #dce3d6;border-radius:5px;background:#fdfefb;padding:14px;transition:border-color .5s}.orch{width:180px;text-align:center;padding:15px 16px}.sprite{width:64px;height:64px;object-fit:contain;image-rendering:pixelated;display:block;margin:-9px auto -2px}.neutral{height:53px;display:grid;place-content:center;color:#a6afa0;font:32px Georgia,serif}.orch h2{font-size:12px;font-weight:500;margin:7px 0}.orch p{font-size:10px;line-height:1.6;color:#8c9684;margin:8px 0 0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.orch.idle{border-color:#e8ece3}.orch.idle h2{color:#a2a99b}.model{font:9px ui-monospace,monospace;color:#929a8b;display:block;margin:1px 0}.gen-title{display:flex;justify-content:space-between;align-items:center;font-size:11px;font-weight:500;margin:0 0 10px}.gen-title small{font:9px ui-monospace,monospace;color:#a0a895}.candidates{max-height:210px;overflow:auto;scrollbar-width:thin}.candidate{display:flex;align-items:center;gap:7px;width:100%;padding:9px 0;border:0;border-top:1px solid #eef0ea;background:none;text-align:left;font:10px/1.4 'DM Sans',Arial,sans-serif;cursor:pointer;color:#6d7964}.candidate .label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.candidate .mark{font-size:10px;flex:none;color:#538068}.candidate.failed,.candidate.dropped{color:#adb2a6}.candidate.failed .mark,.candidate.dropped .mark{color:#b79789}.candidate.running .mark{animation:breathe 1.6s infinite}.candidate:focus-visible,button:focus-visible{outline:1px solid #417d64;outline-offset:3px}.candidate:hover{color:#293126}.gen-label{position:absolute;left:0;right:0;text-align:center;top:-27px;font:9px ui-monospace,monospace;color:#abb2a3;letter-spacing:.08em}.divider{position:absolute;width:1px;height:30px;background:#dce3d6}.key{color:#9ba591;font-size:9px}footer{display:flex;justify-content:space-between;align-items:center;gap:14px;color:#939e89;font-size:10px;padding:16px 0 0}footer>div{display:flex;gap:16px;align-items:center}button{font:inherit}footer button{border:0;background:none;color:#829078;cursor:pointer;padding:0;font-size:10px}#detail{position:fixed;bottom:62px;left:50%;transform:translateX(-50%);max-width:480px;width:calc(100% - 40px);padding:20px 24px;border:1px solid #dce3d6;border-radius:5px;background:#fdfefb;box-shadow:0 12px 40px #2931260b;z-index:4}#detail strong{font-size:12px;font-weight:500}#detail p{font-size:11px;color:#79876e;line-height:1.7;max-height:180px;overflow:auto}#close-detail{float:right;border:0;background:none;color:#809174;cursor:pointer}#error{font-size:11px;color:#ad705d;margin:0}@keyframes breathe{50%{opacity:.25}}@media(max-width:650px){main{padding:20px 18px}header{flex-direction:column;gap:12px}nav{flex-direction:row}.key{display:none}footer{font-size:9px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.orch{height:180px}.orch .neutral{height:53px}.orch p{margin-top:8px}

.generation-caption{position:absolute;width:166px;text-align:center;font:10px ui-monospace,monospace;color:#959f8c}.agent-block{position:absolute;width:166px;height:70px;border:1px solid #dce3d6;border-radius:5px;background:#fdfefb;padding:10px 12px;text-align:left;cursor:pointer;transition:background-color .4s,border-color .4s}.agent-id{display:block;color:#93a088;font:9px ui-monospace,monospace}.agent-label{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font:11px/1.4 'DM Sans',Arial,sans-serif;color:#68775e;margin-top:6px;padding-right:10px}.state-mark{position:absolute;right:12px;top:11px;font-size:10px;color:#63895b}.agent-block.improved,.agent-block.parent{border-color:#c3d8bc;background:#f4f8f0}.agent-block.running{border-color:#b9cdd9;background:#f2f7fa}.agent-block.running .agent-label{color:#536e80}.agent-block.running .state-mark{width:10px;height:10px;border:1.5px solid #ccdce6;border-top-color:#5d8eaf;border-right-color:#5d8eaf;border-radius:50%;animation:working-ring 1s linear infinite}.agent-block.dropped,.agent-block.failed{border-color:#e4d7cf;background:#fbf6f2}.agent-block.dropped .agent-label,.agent-block.failed .agent-label{color:#aa9283}.agent-block.dropped .state-mark,.agent-block.failed .state-mark{color:#bd9a87}.agent-block:hover{filter:brightness(.985)}.key{display:flex;align-items:center;gap:6px}.key i{width:5px;height:5px;border-radius:50%;display:inline-block;margin-left:9px}.legend-working{background:#6c98b7}.legend-kept{background:#8ba67b}.legend-dropped{background:#c4a58e}@keyframes working-ring{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.agent-block.running .state-mark{animation:none}}

.agent-block.disconnected,.agent-block.awaiting_sync,.agent-block.interrupted{background:#faf8f1;border-color:#ddd5b9}.agent-block.disconnected .state-mark,.agent-block.awaiting_sync .state-mark,.agent-block.interrupted .state-mark{color:#aa945f}.job-note{font:8px ui-monospace,monospace;color:#aa945f;display:block;margin-top:3px}.agent-block:has(.job-note) .agent-label{-webkit-line-clamp:1}.agent-block.baseline{background:#f8faf5}.agent-block.baseline .state-mark{color:#8d9c80}

.agent-block.has-avatar{padding-left:43px}.agent-avatar{position:absolute;left:3px;top:18px;width:38px;height:38px;display:grid;place-items:center}.agent-avatar img{width:52px;height:52px;max-width:none;object-fit:contain;image-rendering:pixelated}.agent-avatar>span{color:#9ba78f;font-size:20px}.agent-block.has-avatar .agent-label{font-size:10px;padding-right:0}
.agent-block.has-avatar{padding-left:12px}.agent-block .agent-avatar{position:static;display:inline-flex;vertical-align:middle;width:18px;height:12px;margin-right:3px;align-items:center;justify-content:center}.agent-block .agent-avatar img{width:26px;height:26px}.agent-block .agent-avatar>span{font-size:12px}.agent-block.has-avatar .agent-id{display:inline;vertical-align:middle}.agent-block.has-avatar .agent-label{font-size:11px}

.agent-block{height:86px;padding:12px 14px}.agent-block.has-avatar{padding:12px 14px}.agent-header{height:18px;display:flex;align-items:center;gap:6px;padding-right:12px}.agent-block .agent-avatar{width:16px;height:18px;margin:0;flex:none;position:relative;overflow:visible;display:flex;align-items:center;justify-content:center}.agent-block .agent-avatar img{width:30px;height:30px;flex:none;object-fit:contain}.agent-block.has-avatar .agent-id,.agent-block .agent-id{display:block;line-height:18px;white-space:nowrap;font-size:9px}.agent-block .agent-label,.agent-block.has-avatar .agent-label{font-size:11px;line-height:1.45;margin-top:8px;padding:0}.agent-block .state-mark{top:16px;right:12px}.job-note{margin-top:5px;font-size:8px}.agent-block:has(.job-note) .agent-label{margin-top:5px}

body{background:#e9ede5;padding:24px;min-height:100dvh;display:flex;align-items:center;justify-content:center}main{height:calc(100dvh - 48px);min-height:460px;width:100%;max-width:1600px;background:#fdfefb;border:1px solid #dce3d5;border-radius:26px;padding:24px 28px;box-shadow:0 24px 80px #34462c13,0 3px 12px #34462c06;overflow:hidden;position:relative}.canvas{min-height:280px}header{padding-right:20px}#close-search{position:absolute;right:20px;top:16px;width:24px;height:24px;display:grid;place-items:center;font:22px/1 Arial,sans-serif;color:#8e9a83;cursor:pointer;border-radius:50%}#close-search:hover{background:#edf2e7;text-decoration:none}.agent-block .agent-avatar{top:auto;left:auto}.agent-block .agent-avatar img{display:block}@media(max-width:650px){body{padding:10px}main{height:calc(100dvh - 20px);min-height:460px;padding:22px 18px 16px;border-radius:20px}header{padding-right:24px}#close-search{right:14px;top:12px}}
.agent-header{min-width:0;padding-right:18px;overflow:hidden}.agent-block .agent-avatar{flex:0 0 18px}.agent-block.has-avatar .agent-id,.agent-block .agent-id{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;display:block}
/* Balance the tall GPT artwork without changing the other model sprites. */
img[src="agent-gpt.png"]{transform:scaleX(1.18)}
.final-result{border-color:#9ebca6;background:#eff7ef;box-shadow:0 0 0 3px #417d6409}.final-result .agent-id{font-size:11px;font-weight:600;color:#315b43}.final-result .agent-label{font-size:12px;color:#315b43}.final-note{display:block;font-size:8px;color:#7c8d75;margin-top:5px}.final-result.running{background:#eef4f8;border-color:#adc7d9}
#final-results{display:inline-block;background:#417d64;color:white;padding:8px 14px;border-radius:8px;margin-left:10px;text-decoration:none;font-size:12px}#final-results:hover{background:#315f4c}
