@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;700&display=swap";:root{--bg-color:#f5f6f8;--bg-panel:#fff;--bg-panel-solid:#fff;--bg-elevated:#fff;--bg-subtle:#f1f3f5;--text-main:#1d1d1f;--text-muted:#6b7280;--acid-green:#15a463;--acid-green-dim:#34b87a;--acid-green-glow:#15a46329;--primary:#1d1d1f;--border-color:#00000014;--border-strong:#00000024;--border-active:#15a4638c;--signal-red:#e5484d;--signal-orange:#f5a623;--grid-line:#00000009;--edge-idle:#00000029;--flow-active:#00e676;--flow-glow:#00e6768c;--radius:12px;--radius-sm:8px;--radius-lg:16px;--shadow-sm:0 1px 2px #1018280f;--shadow-md:0 6px 20px #10182814;--shadow-lg:0 20px 48px #10182824;--glass-blur:blur(10px);--glass-border:1px solid var(--border-color)}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);background-image:radial-gradient(var(--grid-line) 1px, transparent 1px);color:var(--text-main);-webkit-font-smoothing:antialiased;letter-spacing:-.01em;background-size:22px 22px;font-family:Inter,system-ui,-apple-system,SF Pro Text,sans-serif;overflow:hidden}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#00000024;border-radius:999px}::-webkit-scrollbar-thumb:hover{background:#00000042}.mono-text{font-family:JetBrains Mono,monospace}.app-shell{width:100vw;height:100vh;display:block;position:relative;overflow:hidden}.area-rail{z-index:10;width:320px;transition:width .22s cubic-bezier(.2,.8,.2,1);position:absolute;top:14px;bottom:14px;left:14px}.area-right{z-index:10;flex-direction:column;gap:12px;width:372px;transition:width .22s cubic-bezier(.2,.8,.2,1);display:flex;position:absolute;top:14px;bottom:14px;right:14px}.area-right__feed{flex:1;min-height:0}.area-rail.is-collapsed,.area-right.is-collapsed{width:46px}.area-center{z-index:1;position:absolute;inset:0}.rail-expand{background:var(--bg-panel);width:100%;height:100%;color:var(--text-muted);border:1px solid var(--border-color);place-items:center;display:grid}.rail-expand:hover{color:var(--acid-green);background:var(--bg-subtle)}.collapse-btn{border-radius:var(--radius-sm);color:var(--text-muted);background:0 0;border:1px solid #0000;justify-content:center;align-items:center;margin-left:2px;padding:4px;display:inline-flex}.collapse-btn:hover{color:var(--acid-green);background:var(--bg-subtle)}.sidebar{padding:0}.sidebar__brand{border-bottom:1px solid var(--border-color);flex-shrink:0;align-items:center;gap:11px;padding:16px 16px 14px;display:flex}.sidebar__logo{background:var(--acid-green-glow);border:1px solid #15a46338;border-radius:9px;place-items:center;width:34px;height:34px;display:grid}.sidebar__brand .collapse-btn{margin-left:auto}.sidebar__brand-txt b{letter-spacing:-.02em;font-size:1rem;font-weight:800;line-height:1.1;display:block}.sidebar__brand-txt small{color:var(--text-muted);letter-spacing:.14em;text-transform:uppercase;margin-top:1px;font-size:.62rem;display:block}.sidebar__sec-head{flex-shrink:0;justify-content:space-between;align-items:center;padding:12px 16px 6px;display:flex}.sidebar__sec-head .ttl{letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);font-size:.66rem;font-weight:700}.sidebar__counter{font-family:JetBrains Mono,monospace;font-size:.74rem;font-weight:700}.sidebar__filters{flex-shrink:0;gap:6px;padding:0 16px 10px;display:flex}.seg{background:var(--bg-subtle);border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-muted);letter-spacing:.06em;flex:1;padding:6px 0;font-family:JetBrains Mono,monospace;font-size:.62rem;font-weight:700;transition:all .16s}.seg:hover{color:var(--text-main)}.seg.is-active{background:var(--primary);color:#fff;border-color:var(--primary)}.sidebar__list{border-top:1px solid var(--border-color);flex:1;min-height:0;overflow-y:auto}.sidebar__nav{border-top:1px solid var(--border-color);flex-shrink:0;grid-template-columns:1fr 1fr;gap:6px;padding:10px;display:grid}.nav-btn{background:var(--bg-panel);color:var(--text-main);border:1px solid var(--border-color);border-radius:var(--radius-sm);text-align:left;align-items:center;gap:8px;padding:9px 10px;font-size:.74rem;font-weight:500;display:inline-flex}.nav-btn span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.nav-btn:hover{background:var(--bg-subtle);border-color:var(--border-strong);color:var(--acid-green);transform:translateY(-1px)}.nav-btn--out{color:var(--text-muted);grid-column:1/-1;justify-content:center}.nav-btn--out:hover{color:var(--signal-red);background:#e5484d0d;border-color:#e5484d66}.metrics{flex-shrink:0;height:auto}.metrics__grid{grid-template-columns:repeat(3,1fr);display:grid}.stat{border-right:1px solid var(--border-color);border-top:1px solid var(--border-color);flex-direction:column;gap:5px;padding:13px 14px;display:flex}.stat:nth-child(3n){border-right:none}.stat:nth-child(-n+3){border-top:none}.stat__val{font-family:JetBrains Mono,monospace;font-size:1.32rem;font-weight:700;line-height:1}.stat__lbl{letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);font-size:.58rem}.panel{background:var(--bg-panel);border:1px solid var(--border-color);border-radius:var(--radius);box-shadow:var(--shadow-md);flex-direction:column;height:100%;min-height:0;display:flex;position:relative;overflow:hidden}.panel--bracket:before,.panel--bracket:after{content:none}.panel__head{border-bottom:1px solid var(--border-color);letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);flex-shrink:0;align-items:center;gap:8px;padding:14px 16px;font-size:.72rem;font-weight:600;display:flex}.panel__head .ttl{color:var(--text-main);font-weight:700}.panel__body{flex:1;min-height:0;overflow-y:auto}.glass-panel{-webkit-backdrop-filter:var(--glass-blur);border:var(--glass-border);border-radius:var(--radius);box-shadow:var(--shadow-md);background:#ffffffb8}button{cursor:pointer;font-family:inherit;font-weight:500;transition:all .18s}button:active{transform:scale(.98)}.badge{letter-spacing:.04em;border-radius:999px;align-items:center;gap:5px;padding:2px 9px;font-family:JetBrains Mono,monospace;font-size:.66rem;font-weight:700;display:inline-flex}.badge-online{color:var(--acid-green);background:#15a4631f;border:1px solid #15a46347}.badge-offline{color:var(--signal-red);background:#e5484d1a;border:1px solid #e5484d47}.badge-warn{color:#b9770f;background:#f5a6231f;border:1px solid #f5a6234d}.live-dot{border-radius:50%;width:9px;height:9px;display:inline-block}.live-on{background:var(--acid-green);box-shadow:0 0 0 4px var(--acid-green-glow);animation:1.6s infinite heartbeat}.live-off{background:var(--signal-red);box-shadow:0 0 0 4px #e5484d29}@keyframes heartbeat{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.82)}}.agent-card{border-bottom:1px solid var(--border-color);background:var(--bg-panel);padding:14px 16px;transition:background .18s,box-shadow .18s}.agent-card:hover{background:var(--bg-subtle)}.agent-card.is-pulsing{box-shadow:inset 3px 0 0 var(--acid-green);background:#15a4630f}.agent-card__top{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.agent-card__name{letter-spacing:-.01em;font-size:.88rem;font-weight:700}.agent-card__row{color:var(--text-muted);gap:14px;font-family:JetBrains Mono,monospace;font-size:.72rem;display:flex}.agent-card__row b{color:var(--text-main);font-weight:500}.icon-btn{background:var(--bg-panel);border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-muted);letter-spacing:.02em;align-items:center;gap:4px;padding:5px 9px;font-size:.62rem;transition:all .16s;display:inline-flex}.icon-btn:hover{color:var(--acid-green);border-color:var(--acid-green);background:#15a4630f}.xray-mode .react-flow__node{opacity:.25;filter:grayscale(60%);transition:opacity .4s,filter .4s}.xray-mode .react-flow__node.xray-active{opacity:1;filter:none;z-index:1000}.xray-mode .react-flow__edge{opacity:.12;transition:opacity .4s}.xray-mode .react-flow__edge.xray-active{opacity:1}.feed-line{border-bottom:1px solid var(--border-color);grid-template-columns:56px 1fr;gap:8px;padding:8px 14px;font-size:.74rem;transition:background .15s;animation:.3s feedIn;display:grid}.feed-line:hover{background:var(--bg-subtle)}@keyframes feedIn{0%{opacity:0;transform:translate(8px)}to{opacity:1;transform:none}}.feed-line__meta{color:var(--text-muted);font-family:JetBrains Mono,monospace;font-size:.64rem}.feed-line__agent{letter-spacing:.02em;font-size:.66rem;font-weight:700}.feed-line__msg{color:var(--text-main);word-break:break-word;line-height:1.4}.feed-line__msg.t-error{color:var(--signal-red)}.feed-line__msg.t-highlight{color:var(--acid-green)}.feed-line__msg.t-sent{color:#0f7a4a}.feed-line__msg.t-received{color:#1f6feb}.feed-tag{border:1px solid var(--border-color);color:var(--text-muted);border-radius:999px;margin-right:6px;padding:2px 7px;font-family:JetBrains Mono,monospace;font-size:.58rem}.toast-host{z-index:4000;flex-direction:column;gap:10px;max-width:320px;display:flex;position:fixed;top:92px;right:18px}.toast{background:var(--bg-panel);border:1px solid var(--border-color);border-left:3px solid var(--signal-orange);border-radius:var(--radius-sm);box-shadow:var(--shadow-lg);padding:12px 14px;font-size:.8rem;animation:.3s cubic-bezier(.2,.8,.2,1) toastIn}.toast.t-error{border-left-color:var(--signal-red)}.toast.t-ok{border-left-color:var(--acid-green)}.toast b{letter-spacing:.02em;text-transform:uppercase;margin-bottom:3px;font-size:.72rem;display:block}.toast small{color:var(--text-muted)}@keyframes toastIn{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:none}}.chat-bubble{border:1px solid var(--border-color);border-radius:var(--radius);max-width:88%;padding:.8rem .95rem;font-size:.86rem;line-height:1.45;position:relative}.chat-received{background:var(--bg-subtle);color:var(--text-main);border-bottom-left-radius:4px;align-self:flex-start}.chat-sent{color:#0f5132;background:#15a4631a;border-color:#15a46338;border-bottom-right-radius:4px;align-self:flex-end}.overlay-modal{z-index:3000;background:var(--bg-panel);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);flex-direction:column;animation:.22s cubic-bezier(.2,.8,.2,1) modalIn;display:flex;position:fixed;overflow:hidden}@keyframes modalIn{0%{opacity:0;transform:translateY(-8px)scale(.99)}to{opacity:1;transform:none}}.modal-close{color:var(--text-muted);cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;padding:0 4px;font-size:1.3rem;line-height:1}.modal-close:hover{color:var(--signal-red)}.panel__head{background:var(--bg-panel);z-index:2;position:sticky;top:0}.react-flow__node{cursor:pointer}.login-screen{background:radial-gradient(circle at 50% -10%, #15a46312, transparent 45%), var(--bg-color);place-items:center;width:100vw;height:100vh;padding:20px;display:grid}.login-card{flex-direction:column;gap:14px;width:100%;max-width:380px;height:auto;padding:34px 30px;display:flex}.login-brand{align-items:center;gap:11px;margin-bottom:6px;display:flex}.login-brand b{letter-spacing:-.01em;font-size:.95rem;font-weight:800;display:block}.login-brand small{color:var(--text-muted);letter-spacing:.16em;font-size:.58rem;display:block}.login-title{letter-spacing:-.02em;font-size:1.35rem;font-weight:700}.login-sub{color:var(--text-muted);margin-top:-6px;margin-bottom:6px;font-size:.82rem}.login-field{background:var(--bg-subtle);border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-muted);align-items:center;gap:10px;padding:11px 13px;transition:border-color .18s,box-shadow .18s,background .18s;display:flex}.login-field:focus-within{border-color:var(--border-active);box-shadow:0 0 0 3px var(--acid-green-glow);color:var(--acid-green);background:#fff}.login-field input{color:var(--text-main);background:0 0;border:none;outline:none;flex:1;font-family:inherit;font-size:.9rem}.login-field input::placeholder{color:var(--text-muted)}.login-error{color:var(--signal-red);border-radius:var(--radius-sm);background:#e5484d14;border:1px solid #e5484d40;padding:9px 12px;font-size:.78rem}.login-btn{background:var(--primary);color:#fff;border-radius:var(--radius-sm);letter-spacing:.01em;border:none;justify-content:center;align-items:center;gap:8px;margin-top:4px;padding:12px;font-size:.88rem;font-weight:600;display:inline-flex}.login-btn:hover:not(:disabled){box-shadow:var(--shadow-md);transform:translateY(-1px)}.login-btn:disabled{opacity:.55;cursor:not-allowed}.spin{animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.logout-btn{border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-muted);letter-spacing:.01em;background:0 0;align-items:center;gap:6px;padding:8px 11px;font-size:.7rem;display:inline-flex}.logout-btn:hover{color:var(--signal-red);background:#e5484d0d;border-color:#e5484d66}.node-sub{color:var(--text-muted);letter-spacing:.02em;white-space:nowrap;text-overflow:ellipsis;margin-top:3px;font-family:JetBrains Mono,monospace;font-size:.58rem;overflow:hidden}.brutalist-node{background:var(--bg-panel);border:1px solid var(--border-color);border-radius:var(--radius-sm);min-width:150px;max-width:200px;box-shadow:var(--shadow-sm);padding:10px 13px;transition:border-color .2s,box-shadow .2s,transform .2s;position:relative}.brutalist-node:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}.brutalist-node .node-header{letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);margin-bottom:4px;font-size:.56rem;font-weight:700}.brutalist-node .node-title{color:var(--text-main);white-space:nowrap;text-overflow:ellipsis;font-size:.82rem;font-weight:700;overflow:hidden}.brutalist-node.active{border-color:var(--border-active);box-shadow:0 0 0 3px var(--acid-green-glow), var(--shadow-sm)}.brutalist-node.active .node-header{color:var(--acid-green)}.brutalist-node.error{border-color:#e5484d8c;box-shadow:0 0 0 3px #e5484d24}.brutalist-node.dim,.brutalist-node[class*=bn-][class*=dim]{opacity:.55}.bn-agent{border-left:3px solid var(--acid-green-dim)}.bn-agent.active{border-left-color:var(--acid-green)}.bn-router{border-left:3px solid var(--signal-orange);background:#f5a6230d}.bn-router .node-header{color:#b9770f}.bn-router.active{box-shadow:0 0 0 3px #f5a6232e, var(--shadow-sm)}.bn-infra{border-left:3px solid #64748b80}.bn-infra .node-header{color:#64748b}.bn-provider{background:#8b7cf60f;border-left:3px solid #8b7cf6;min-width:132px}.bn-provider .node-header{color:#6d5fd6}.bn-provider.active{box-shadow:0 0 0 3px #8b7cf62e, var(--shadow-sm);border-color:#8b7cf6}.bn-database{background:#0ea5b70d;border-left:3px solid #0ea5b7;min-width:132px}.bn-database .node-header{color:#0e7c8a}.bn-database.active{box-shadow:0 0 0 3px #0ea5b729, var(--shadow-sm);border-color:#0ea5b7}.bn-scheduler{background:#f973160f;border-left:3px solid #f97316;min-width:132px}.bn-scheduler .node-header{color:#c2570c}.bn-scheduler.active{box-shadow:0 0 0 3px #f9731633, var(--shadow-sm);border-color:#f97316}.bn-usertype{opacity:.55;min-width:110px;box-shadow:none;background:0 0;border:1px dashed #00000029;border-left:none}.bn-usertype .node-header{font-size:.5rem}.bn-usertype .node-title{font-size:.72rem}.bn-usertype:hover{opacity:.8;box-shadow:none;transform:none}.react-flow__edge-path{transition:stroke .3s}.react-flow__edge-textbg{rx:4}.flow-lane-labels{pointer-events:none;z-index:5;background:linear-gradient(#f5f6f8e6 0%,#0000 100%);width:100%;height:26px;position:absolute;top:0;left:0}.flow-lane-labels span{letter-spacing:.12em;text-transform:uppercase;color:#6b7280b3;white-space:nowrap;font-family:JetBrains Mono,monospace;font-size:.55rem;position:absolute;top:6px;transform:translate(0)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}
