@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap";:root{--bg-base:#fff;--bg-panel:#f8fafc;--bg-card:#fff;--bg-hover:#f1f5f9;--bg-active:#e2e8f0;--accent:#6366f1;--accent-dim:#6366f130;--green:#10b981;--green-dim:#10b98120;--amber:#f59e0b;--violet:#3b82f6;--red:#ef4444;--text-1:#0f172a;--text-2:#475569;--text-3:#64748b;--border:#e2e8f0;--border-hi:#cbd5e1;--font-ui:"Inter", system-ui, sans-serif;--font-code:"JetBrains Mono", "Fira Code", monospace;--header-h:52px;--graph-h:82px;--input-h:110px;--left-w:260px;--right-w:400px;--radius:8px;--radius-lg:12px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;overflow:hidden}body{font-family:var(--font-ui);background:var(--bg-base);color:var(--text-1);-webkit-font-smoothing:antialiased;font-size:13px}button{cursor:pointer;background:0 0;border:none;font-family:inherit}textarea{resize:none;font-family:inherit}.studio{grid-template-rows:var(--header-h) var(--graph-h) 1fr var(--input-h);grid-template-columns:1fr;height:100vh;display:grid;overflow:hidden}.studio-header{background:var(--bg-panel);border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;gap:12px;padding:0 16px;display:flex}.header-left{flex:1;align-items:center;gap:10px;display:flex;overflow:hidden}.header-right{flex-shrink:0;align-items:center;gap:8px;display:flex}.logo{flex-shrink:0;align-items:center;gap:7px;display:flex}.logo-mark{background:linear-gradient(135deg, var(--accent), var(--violet));border-radius:6px;justify-content:center;align-items:center;width:28px;height:28px;display:flex}.logo-name{color:var(--text-1);font-size:14px;font-weight:700}.logo-beta{background:var(--accent-dim);color:var(--accent);border:1px solid var(--accent);border-radius:4px;padding:1px 5px;font-size:9px;font-weight:700}.mode-tabs{gap:2px;display:flex}.mode-tab{color:var(--text-3);border-radius:6px;align-items:center;gap:5px;padding:5px 10px;font-size:12px;font-weight:500;transition:all .15s;display:flex}.mode-tab:hover{color:var(--text-2);background:var(--bg-hover)}.mode-tab-active{color:var(--accent)!important;background:var(--accent-dim)!important}.status-badge{background:var(--bg-card);border:1px solid var(--border);color:var(--text-2);border-radius:20px;align-items:center;gap:5px;padding:4px 10px;font-size:11px;font-weight:500;display:flex}.status-badge.running{border-color:var(--accent);color:var(--accent)}.status-badge.done{border-color:var(--green);color:var(--green)}.status-badge.error{border-color:var(--red);color:var(--red)}.status-dot{background:var(--text-3);border-radius:50%;width:7px;height:7px}.status-dot.running{background:var(--accent);animation:1.2s infinite pulse-dot}.status-dot.done{background:var(--green)}.status-dot.error{background:var(--red)}.thread-id{font-family:var(--font-code);color:var(--text-3);font-size:11px}.header-btn{color:var(--text-2);background:var(--bg-card);border:1px solid var(--border);border-radius:6px;align-items:center;gap:5px;padding:5px 10px;font-size:12px;font-weight:500;transition:all .15s;display:flex}.header-btn:hover{border-color:var(--border-hi);color:var(--text-1)}.demo-btn{border-color:var(--green)!important;color:var(--green)!important;background:var(--green-dim)!important}.demo-btn:hover:not(:disabled){box-shadow:0 0 12px var(--green-dim);background:#10b98130!important}.graph-flow-bar{background:var(--bg-panel);border-bottom:1px solid var(--border);align-items:center;gap:12px;padding:0 16px;display:flex;overflow:hidden}.graph-flow-label{color:var(--text-3);white-space:nowrap;flex-shrink:0;align-items:center;gap:6px;font-size:11px;font-weight:600;display:flex}.graph-running-badge{color:var(--accent);font-size:10px;animation:1s infinite blink}.graph-done-badge{color:var(--green);font-size:10px}.graph-status-dot{background:var(--text-3);border-radius:50%;width:6px;height:6px}.graph-status-dot.running{background:var(--accent);animation:1.2s infinite pulse-dot}.graph-status-dot.done{background:var(--green)}.graph-svg-wrapper{flex:1;min-width:0;height:64px}.graph-svg{width:100%;height:100%}.node-active{animation:1.4s ease-in-out infinite alternate node-glow}@keyframes node-glow{0%{filter:drop-shadow(0 0 4px #6366f180)}to{filter:drop-shadow(0 0 10px #6366f1cc)}}.glow-ring{animation:1.4s ease-in-out infinite ring-pulse}@keyframes ring-pulse{0%,to{opacity:.3;transform:scale(1)}50%{opacity:.8;transform:scale(1.04)}}.node-pulse-dot{animation:1s infinite pulse-dot}.edge-pulse{animation:1.5s linear infinite edge-flow}@keyframes edge-flow{0%{stroke-dashoffset:20px}to{stroke-dashoffset:0}}.studio-panels{grid-template-columns:var(--left-w) 1fr var(--right-w);min-height:0;display:grid;overflow:hidden}.panel{background:var(--bg-panel);border-right:1px solid var(--border);flex-direction:column;display:flex;overflow:hidden}.panel:last-child{border-right:none}.panel-header{border-bottom:1px solid var(--border);background:var(--bg-card);flex-shrink:0;align-items:center;gap:6px;height:38px;padding:0 12px;display:flex}.panel-header-icon{opacity:.8;font-size:13px}.panel-header-title{color:var(--text-2);flex:1;font-size:12px;font-weight:600}.panel-header-badge{background:var(--accent-dim);color:var(--accent);border-radius:10px;padding:1px 6px;font-size:10px;font-weight:700}.panel-divider{background:var(--border);height:1px;margin:4px 0}.panel-section-label{text-transform:uppercase;letter-spacing:.8px;color:var(--text-3);padding:6px 12px 2px;font-size:10px;font-weight:600}.panel-empty{color:var(--text-3);text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:10px;padding:24px;font-size:12px;display:flex}.panel-empty-icon{opacity:.5;font-size:28px}.panel-left{border-left:none}.file-tree{flex:1;padding:8px 0;overflow-y:auto}.file-tree-root{color:var(--text-3);align-items:center;gap:6px;padding:4px 12px;font-size:12px;display:flex}.file-tree-folder-icon{font-size:10px}.file-tree-folder-name{font-weight:600}.file-tree-children{padding-left:8px}.file-tree-item{width:100%;color:var(--text-2);text-align:left;border-radius:0;align-items:center;gap:7px;padding:5px 12px;font-size:12px;transition:all .15s;animation:.3s both slide-in;display:flex;position:relative}.file-tree-item:hover{background:var(--bg-hover);color:var(--text-1)}.file-tree-item-active{background:var(--bg-active)!important;color:var(--accent)!important}.file-icon-badge{font-size:9px;font-weight:700;font-family:var(--font-code);border-radius:3px;flex-shrink:0;padding:1px 4px}.file-name{font-family:var(--font-code);text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.file-active-dot{background:var(--accent);border-radius:50%;flex-shrink:0;width:6px;height:6px}.execution-timeline{padding:4px 0 8px;overflow-y:auto}.tool-chip{background:var(--bg-card);border:1px solid var(--border);border-left:2px solid var(--chip-color,var(--accent));border-radius:6px;align-items:center;gap:8px;margin:3px 8px;padding:6px 10px;animation:.25s both slide-in;display:flex}.tool-chip-icon{font-size:14px}.tool-chip-info{flex:1}.tool-chip-label{color:var(--text-1);font-size:11px;font-weight:600;display:block}.tool-chip-tool{color:var(--text-3);font-size:10px;font-family:var(--font-code);display:block}.tool-chip-done{color:var(--green);font-size:12px}.agent-running-indicator{color:var(--text-3);align-items:center;gap:6px;padding:8px 12px;font-size:11px;display:flex}.running-dots{gap:3px;display:flex}.running-dots span{background:var(--accent);border-radius:50%;width:5px;height:5px;animation:1.2s infinite dot-bounce}.running-dots span:nth-child(2){animation-delay:.2s}.running-dots span:nth-child(3){animation-delay:.4s}.panel-center{border-right:1px solid var(--border);background:#fff}.code-panel-header{justify-content:space-between;overflow:hidden}.code-tabs{flex:1;gap:0;min-width:0;display:flex;overflow-x:auto}.code-tab{height:38px;font-size:11px;font-family:var(--font-code);color:var(--text-3);white-space:nowrap;border-bottom:2px solid #0000;flex-shrink:0;align-items:center;gap:5px;padding:0 12px;transition:all .15s;display:flex}.code-tab:hover{color:var(--text-2);background:var(--bg-hover)}.code-tab-active{color:var(--text-1)!important;border-bottom-color:var(--accent)!important}.code-tab-dot{border-radius:50%;flex-shrink:0;width:6px;height:6px}.code-panel-actions{flex-shrink:0;align-items:center;gap:6px;display:flex}.lang-badge{background:var(--bg-card);color:var(--text-3);border:1px solid var(--border);border-radius:4px;padding:2px 7px;font-size:10px;font-weight:600}.icon-action-btn{color:var(--text-3);border:1px solid var(--border);border-radius:5px;padding:3px 8px;font-size:11px;transition:all .15s}.icon-action-btn:hover{color:var(--text-1);border-color:var(--border-hi)}.code-viewer{flex:1;padding:12px 0;position:relative;overflow:auto}.code-content{min-height:100%;display:flex}.code-line-numbers{text-align:right;font-family:var(--font-code);color:var(--text-3);-webkit-user-select:none;user-select:none;border-right:1px solid var(--border);flex-shrink:0;min-width:40px;padding:0 10px;font-size:12px;line-height:1.7}.line-num{line-height:1.7}.code-pre{font-family:var(--font-code);color:var(--text-1);white-space:pre;flex:1;padding:0 16px;font-size:12.5px;line-height:1.7;overflow-x:auto}.code-cursor{color:var(--accent);font-family:var(--font-code);animation:.8s step-end infinite blink;display:inline-block}.code-empty-terminal{background:var(--bg-panel);border:1px solid var(--border-hi);border-radius:var(--radius-lg);width:280px;overflow:hidden}.terminal-bar{background:var(--bg-card);border-bottom:1px solid var(--border);gap:6px;padding:10px 14px;display:flex}.terminal-bar span{border-radius:50%;width:11px;height:11px}.terminal-bar span:first-child{background:#ff5f56}.terminal-bar span:nth-child(2){background:#ffbd2e}.terminal-bar span:nth-child(3){background:#27c93f}.terminal-body{padding:16px}.terminal-prompt{font-family:var(--font-code);color:var(--green);margin-bottom:8px;font-size:12px}.terminal-desc{color:var(--text-3);font-size:12px;line-height:1.5}.terminal-cursor{color:var(--green);font-family:var(--font-code);animation:.8s step-end infinite blink;display:inline-block}.panel-right{border-right:none}.chat-messages{flex-direction:column;flex:1;gap:2px;padding:12px 0;display:flex;overflow-y:auto}.welcome-hero{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:14px;padding:32px 20px;display:flex}.hero-icon{background:linear-gradient(135deg, var(--accent), var(--violet));width:52px;height:52px;box-shadow:0 0 30px var(--accent-dim);border-radius:14px;justify-content:center;align-items:center;display:flex}.hero-title{font-size:20px;font-weight:700}.hero-sub{color:var(--text-3);font-size:12px;line-height:1.5}.hero-chips{flex-direction:column;gap:6px;width:100%;display:flex}.hero-chip{background:var(--bg-card);border:1px solid var(--border);color:var(--text-2);text-align:left;border-radius:7px;padding:8px 12px;font-size:12px;transition:all .15s}.hero-chip:hover{border-color:var(--accent);color:var(--text-1);background:var(--bg-active)}.message{gap:8px;padding:8px 12px;animation:.2s both slide-in;display:flex}.message-user{flex-direction:row-reverse}.msg-avatar{border-radius:7px;flex-shrink:0;justify-content:center;align-items:center;width:26px;height:26px;display:flex}.avatar-ai{background:linear-gradient(135deg, var(--accent), var(--violet))}.avatar-user{background:var(--bg-hover);border:1px solid var(--border-hi);color:var(--text-2)}.msg-body{flex:1;min-width:0}.msg-role{color:var(--text-3);margin-bottom:4px;font-size:10px;font-weight:600}.message-user .msg-role{text-align:right}.msg-content{color:var(--text-2);font-size:13px;line-height:1.6}.message-user .msg-content{background:var(--bg-active);border:1px solid var(--border-hi);color:var(--text-1);border-radius:10px 10px 2px;padding:8px 12px}.msg-content h1,.msg-content h2,.msg-content h3{color:var(--text-1);margin:10px 0 6px;font-weight:600}.msg-content h1{font-size:16px}.msg-content h2{font-size:14px}.msg-content h3{font-size:13px}.msg-content p{margin:4px 0}.msg-content code{font-family:var(--font-code);background:var(--bg-card);color:var(--accent);border-radius:4px;padding:1px 5px;font-size:11px}.msg-content pre{background:var(--bg-base);border:1px solid var(--border);border-radius:6px;margin:8px 0;padding:10px;overflow-x:auto}.msg-content pre code{color:#cdd6f4;background:0 0;padding:0}.msg-content ul,.msg-content ol{padding-left:16px}.msg-content li{margin:2px 0}.msg-content table{border-collapse:collapse;width:100%;margin:8px 0;font-size:12px}.msg-content th,.msg-content td{border:1px solid var(--border);text-align:left;padding:5px 8px}.msg-content th{background:var(--bg-card);font-weight:600}.msg-content strong{color:var(--text-1)}.msg-content a{color:var(--accent)}.msg-actions{gap:6px;margin-top:6px;display:flex}.msg-btn{color:var(--text-3);border:1px solid var(--border);border-radius:5px;align-items:center;gap:4px;padding:3px 8px;font-size:11px;transition:all .15s;display:flex}.msg-btn:hover{color:var(--text-1);border-color:var(--border-hi)}.tool-call-bubble{background:var(--bg-card);border:1px solid var(--border);border-left:2px solid var(--violet);color:var(--text-3);border-radius:6px;align-items:center;gap:7px;margin:4px 12px;padding:6px 10px;font-size:12px;animation:.2s both slide-in;display:flex}.tool-call-icon{font-size:13px}.streaming-content{opacity:.85}.thinking-row{color:var(--text-3);align-items:center;gap:8px;padding:10px 12px;font-size:12px;display:flex}.thinking-dots{gap:4px;display:flex}.thinking-dots span{background:var(--accent);border-radius:50%;width:6px;height:6px;animation:1.2s infinite dot-bounce}.thinking-dots span:nth-child(2){animation-delay:.2s}.thinking-dots span:nth-child(3){animation-delay:.4s}.thinking-label{color:var(--text-3)}.input-bar{background:var(--bg-panel);border-top:1px solid var(--border);flex-direction:column;gap:4px;padding:8px 16px 4px;display:flex}.input-inner{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);flex-direction:column;gap:6px;padding:10px 12px;transition:border-color .15s;display:flex}.input-inner:focus-within{border-color:var(--border-hi)}.chat-input{width:100%;color:var(--text-1);background:0 0;border:none;outline:none;min-height:22px;max-height:120px;font-size:13px;line-height:1.5}.chat-input::placeholder{color:var(--text-3)}.chat-input:disabled{opacity:.5}.input-toolbar{justify-content:space-between;align-items:center;display:flex}.input-hints{gap:6px;display:flex}.hint-chip{color:var(--text-3);background:var(--bg-hover);border:1px solid var(--border);border-radius:4px;padding:2px 6px;font-size:10px}.char-count{color:var(--amber)}.send-btn{background:linear-gradient(135deg, var(--accent), var(--violet));color:#fff;border-radius:7px;align-items:center;gap:5px;padding:6px 14px;font-size:12px;font-weight:600;transition:all .15s;display:flex}.send-btn:hover:not(:disabled){opacity:.9;transform:translateY(-1px)}.send-btn:disabled{opacity:.4;cursor:not-allowed;transform:none}.send-btn-running{background:var(--bg-card);border:1px solid var(--border);color:var(--text-2)}.send-spinner{border:2px solid var(--border-hi);border-top-color:var(--accent);border-radius:50%;width:10px;height:10px;animation:.8s linear infinite spin;display:inline-block}.input-footer{color:var(--text-3);align-items:center;gap:8px;padding:0 2px;font-size:10px;display:flex}.input-footer span{align-items:center;gap:3px;display:flex}@keyframes slide-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse-dot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.75)}}@keyframes dot-bounce{0%,80%,to{opacity:.4;transform:scale(1)}40%{opacity:1;transform:scale(1.3)}}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}@keyframes spin{to{transform:rotate(360deg)}}.sim-overlay-container{top:50px;left:var(--left-w);width:calc(100vw - var(--left-w) - var(--right-w));z-index:100;pointer-events:none;position:absolute}.sim-panel{pointer-events:auto;margin-inline:auto;background:var(--bg-card);border:1px solid var(--border-hi);border-radius:var(--radius-lg);max-width:500px;margin-top:12px;animation:.4s ease-out slide-in;overflow:hidden;box-shadow:0 8px 32px #0006}.sim-header{border-bottom:1px solid var(--border);background:#ffffff08;justify-content:space-between;align-items:center;padding:10px 14px;display:flex}.sim-header-title{color:var(--text-1);align-items:center;gap:8px;font-size:12px;font-weight:600;display:flex}.sim-icon-accent{color:var(--accent)}.sim-badge{background:var(--bg-base);border:1px solid var(--border);border-radius:20px;align-items:center;gap:6px;padding:3px 10px;font-size:10px;font-weight:700;display:flex}.sim-badge.done{border-color:var(--green);color:var(--green);background:var(--green-dim)}.sim-badge.error{border-color:var(--red);color:var(--red);background:#ef44441a}.sim-dot{background:var(--text-3);border-radius:50%;width:6px;height:6px}.sim-dot.active{background:var(--green);box-shadow:0 0 8px var(--green)}.sim-dot.loading{background:var(--accent);animation:1s infinite pulse-dot}.sim-content{min-height:120px;padding:16px}.sim-loading-view{height:100%;color:var(--text-3);flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex}.sim-spinner-container{width:48px;height:48px;position:relative}.sim-spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:100%;height:100%;animation:1s linear infinite spin}.sim-spinner-icon{color:var(--accent);opacity:.5;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.sim-stats-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.sim-stat-card{background:var(--bg-base);border:1px solid var(--border);border-radius:var(--radius);padding:12px;transition:transform .2s}.sim-stat-card:hover{border-color:var(--border-hi);transform:translateY(-2px)}.sim-stat-card.highlight{background:linear-gradient(135deg, var(--bg-card), var(--bg-active));border-color:var(--accent-dim);grid-column:span 2}.stat-label{text-transform:uppercase;color:var(--text-3);align-items:center;gap:6px;margin-bottom:4px;font-size:10px;font-weight:600;display:flex}.stat-value{color:var(--text-1);font-size:20px;font-weight:700}.highlight .stat-value{color:var(--accent);text-shadow:0 0 15px var(--accent-dim)}.stat-sub{color:var(--text-3);font-size:10px}.sim-query-details{grid-column:span 2;margin-top:6px}.query-header{color:var(--text-3);align-items:center;gap:6px;margin-bottom:6px;font-size:10px;font-weight:600;display:flex}.query-code{border-radius:var(--radius);font-family:var(--font-code);color:#a6accd;border:1px solid var(--border);background:#05070a;padding:10px;font-size:11px;overflow-x:auto}.sim-reset-btn{background:var(--bg-hover);border:1px solid var(--border-hi);border-radius:var(--radius);color:var(--text-2);margin-top:12px;padding:8px 16px;font-size:11px;font-weight:600;transition:all .2s}.sim-reset-btn:hover{background:var(--bg-active);color:var(--text-1)}.sim-reset-btn.mini{opacity:.6;grid-column:span 2;width:fit-content;margin-inline:auto}.sim-error-view{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:8px;display:flex}.sim-error-view h4{color:var(--text-1);font-size:14px}.sim-error-view p{color:var(--text-3);max-width:240px;font-size:12px}.chaos-mode{--accent:var(--red);--accent-dim:#ef444426;--border-hi:#451a1a}.studio.chaos-mode{border:2px solid var(--red);animation:2s infinite red-alert-pulse}@keyframes red-alert-pulse{0%{box-shadow:inset 0 0 0px var(--red)}50%{box-shadow:inset 0 0 50px #ef444433}to{box-shadow:inset 0 0 0px var(--red)}}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ffffff1a padding-box padding-box;border:1px solid #0000;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#fff3 padding-box padding-box;border:1px solid #0000}*{scrollbar-width:thin;scrollbar-color:#ffffff1a transparent}.glass-effect{-webkit-backdrop-filter:blur(12px)saturate(180%);background:#0f172ab3;border:1px solid #ffffff1a}.animate-glow{filter:drop-shadow(0 0 8px var(--accent-dim))}.chaos-btn{border-color:var(--red)!important;color:var(--red)!important;background:#ef44441a!important}.chaos-btn:hover:not(:disabled){box-shadow:0 0 15px #ef44444d;background:#ef444433!important}.chaos-mode .logo-mark,.chaos-mode .send-btn{background:linear-gradient(135deg,#ef4444,#991b1b)}.chaos-mode .msg-content code{color:var(--red);background:#ef44441a}.mock-server-overlay{bottom:0;left:var(--left-w);width:calc(100vw - var(--left-w) - var(--right-w));z-index:90;pointer-events:none;padding:10px;position:absolute}.mock-server-overlay>*{pointer-events:auto}.security-console{color:#10b981;z-index:100;background:#0a0a0af2;border:1px solid #333;border-radius:8px;flex-direction:column;width:400px;max-height:300px;font-family:Cascadia Code,Fira Code,monospace;font-size:12px;display:flex;position:absolute;top:10px;right:10px;overflow:hidden;box-shadow:0 10px 30px #00000080}.console-header{background:#1a1a1a;border-bottom:1px solid #333;justify-content:space-between;padding:8px 12px;display:flex}.console-title{color:#a3a3a3;align-items:center;gap:6px;display:flex}.status-badge{border-radius:4px;align-items:center;gap:4px;padding:2px 6px;font-weight:700;display:flex}.status-badge.safe{color:#10b981;background:#10b9811a}.status-badge.danger{color:#ef4444;background:#ef44441a}.console-body{flex:1;padding:10px;overflow-y:auto}.log-entry{margin-bottom:8px}.log-timestamp{color:#52525b;margin-right:8px}.log-status{margin-right:8px;font-weight:700}.log-rejected .log-status{color:#ef4444}.log-clean .log-status{color:#10b981}.log-content{color:#d4d4d8;margin-top:4px}.log-content h1,.log-content h2,.log-content h3{color:#ef4444;margin:4px 0;font-size:14px}.glitch-effect{border-color:#ef4444;animation:.2s ease-in-out infinite alternate glitch}@keyframes glitch{0%{transform:translate(1px,1px)}50%{transform:translate(-1px,-1px)}to{transform:translate(1px,-1px)}}.performance-dashboard{z-index:100;border-radius:12px;flex-direction:column;width:400px;max-height:400px;display:flex;position:absolute;top:10px;left:10px;overflow:hidden;box-shadow:0 10px 40px #0000004d}.perf-header{border-bottom:1px solid var(--border-hi);background:#ffffff0d;align-items:center;gap:8px;padding:12px;display:flex}.perf-header h3{color:var(--text-1);margin:0;font-size:14px}.perf-grid{flex-direction:column;gap:10px;padding:12px;display:flex;overflow-y:auto}.perf-card{background:var(--bg-hover);border:1px solid var(--border-lo);border-radius:8px;padding:10px}.perf-card-warning{background:#ef44440d;border-color:#ef44444d}.perf-card-header{justify-content:space-between;align-items:center;margin-bottom:6px;display:flex}.perf-op{color:var(--text-2);font-family:Cascadia Code,monospace;font-size:12px;font-weight:700}.perf-badge{border-radius:12px;align-items:center;gap:4px;padding:2px 6px;font-size:11px;font-weight:700;display:flex}.badge-green{color:#10b981;background:#10b9811a}.badge-yellow{color:#f59e0b;background:#f59e0b1a}.badge-red{color:#ef4444;background:#ef44441a}.pulse-icon{animation:1.5s infinite pulse-icon}@keyframes pulse-icon{0%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.1)}to{opacity:1;transform:scale(1)}}.perf-suggestion{color:var(--text-3);margin:0 0 8px;font-size:12px;line-height:1.4}.optimize-btn{color:#ef4444;cursor:pointer;background:#ef44441a;border:1px solid #ef44444d;border-radius:6px;justify-content:center;align-items:center;gap:6px;width:100%;padding:6px;font-size:11px;font-weight:700;transition:all .2s;display:flex}.optimize-btn:hover{background:#ef444433}.cap-slider-wrapper{justify-content:center;padding:0 16px 10px;display:flex}.cap-slider-container{background:var(--bg-hover);border:1px solid var(--border-hi);border-radius:12px;width:100%;max-width:600px;padding:12px 20px;transition:opacity .3s}.cap-slider-container.disabled{opacity:.5;pointer-events:none}.cap-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.cap-title{color:var(--text-1);margin:0;font-size:14px;font-weight:600}.cap-badge{border-radius:12px;padding:2px 8px;font-size:11px;font-weight:700}.cap-slider-cp{color:#3b82f6;background:#3b82f61a}.cap-slider-balanced{color:#3b82f6;background:#a855f71a}.cap-slider-ap{color:#f97316;background:#f973161a}.cap-track-wrapper{flex-direction:column;gap:12px;display:flex}.cap-range{-webkit-appearance:none;background:#334155;border-radius:3px;outline:none;width:100%;height:6px;transition:all .3s}.cap-range::-webkit-slider-thumb{appearance:none;cursor:pointer;background:#fff;border-radius:50%;width:16px;height:16px;transition:transform .1s}.cap-range::-webkit-slider-thumb:hover{transform:scale(1.2)}.cap-range.cap-slider-cp::-webkit-slider-thumb{box-shadow:0 0 10px #3b82f6}.cap-range.cap-slider-balanced::-webkit-slider-thumb{box-shadow:0 0 10px #3b82f6}.cap-range.cap-slider-ap::-webkit-slider-thumb{box-shadow:0 0 10px #f97316}.cap-labels{justify-content:space-between;padding:0 4px;display:flex}.cap-label{text-align:center;cursor:pointer;color:var(--text-3);flex-direction:column;align-items:center;gap:4px;width:33%;font-size:11px;transition:color .2s;display:flex}.cap-label:hover{color:var(--text-1)}.active-icon{color:#3b82f6;animation:.3s cubic-bezier(.175,.885,.32,1.275) pop}.active-icon.cp-color{color:#3b82f6}.active-icon.ap-color{color:#f97316}@keyframes pop{0%{transform:scale(1)}50%{transform:scale(1.3)}to{transform:scale(1)}}.resilience-auditor-hud{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#0f172ae0;border:1px solid #ffffff1a;border-radius:14px;flex-direction:column;gap:16px;margin:14px 16px;padding:18px 20px;animation:.3s cubic-bezier(.16,1,.3,1) fadeIn;display:flex;box-shadow:0 8px 32px #00000073}.resilience-hud-header{border-bottom:1px solid #ffffff14;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding-bottom:12px;display:flex}.hud-title-group{align-items:center;gap:12px;display:flex}.hud-icon-badge{border-radius:10px;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.badge-ha{color:#10b981;background:#10b98126;border:1px solid #10b98166;box-shadow:0 0 12px #10b98133}.badge-risk{color:#ef4444;background:#ef444426;border:1px solid #ef444466;box-shadow:0 0 12px #ef444433}.hud-title{color:#f8fafc;letter-spacing:-.01em;margin:0;font-size:15px;font-weight:700}.hud-subtitle{color:#94a3b8;margin-top:2px;font-size:11px;display:block}.hud-actions{align-items:center;gap:8px;display:flex}.preset-toggle-group{background:#00000059;border:1px solid #ffffff14;border-radius:8px;gap:4px;padding:3px;display:flex}.preset-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-radius:6px;padding:6px 12px;font-size:11px;font-weight:600;transition:all .2s}.preset-btn:hover{color:#f1f5f9}.preset-btn.preset-active{color:#60a5fa;background:#3b82f633;border:1px solid #3b82f666;box-shadow:0 2px 8px #3b82f626}.hud-refresh-btn{color:#cbd5e1;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:8px;justify-content:center;align-items:center;width:32px;height:32px;transition:all .2s;display:flex}.hud-refresh-btn:hover{color:#fff;background:#ffffff1a}.spin{animation:1s linear infinite spinAround}@keyframes spinAround{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.resilience-metrics-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;display:grid}.resilience-stat-card{background:#1e293b80;border:1px solid #ffffff14;border-radius:10px;flex-direction:column;gap:8px;padding:14px 16px;transition:all .2s;display:flex}.stat-card-green{border-color:#10b9814d;box-shadow:inset 0 0 15px #10b9810d}.stat-card-red{border-color:#ef44444d;box-shadow:inset 0 0 15px #ef44440d}.stat-card-top{justify-content:space-between;align-items:center;display:flex}.stat-label{letter-spacing:.05em;color:#94a3b8;font-size:10px;font-weight:700}.status-pill{border-radius:12px;padding:2px 8px;font-size:10px;font-weight:700}.pill-green{color:#10b981;background:#10b98126;border:1px solid #10b9814d}.pill-red{color:#ef4444;background:#ef444426;border:1px solid #ef44444d}.pill-neutral{color:#94a3b8;background:#94a3b81a;border:1px solid #94a3b833}.stat-value-row{align-items:baseline;gap:8px;display:flex}.stat-primary-value{color:#f8fafc;font-size:24px;font-weight:800;font-family:var(--font-mono,monospace)}.stat-subtext{color:#64748b;font-size:11px}.stat-progress-bar{background:#ffffff0f;border-radius:2px;width:100%;height:4px;margin-top:4px;overflow:hidden}.progress-fill{height:100%;transition:width .5s cubic-bezier(.16,1,.3,1)}.fill-green{background:linear-gradient(90deg,#10b981,#34d399);box-shadow:0 0 8px #10b98180}.fill-red{background:linear-gradient(90deg,#ef4444,#f87171);box-shadow:0 0 8px #ef444480}.stat-description{color:#cbd5e1;margin:0;font-size:11px;line-height:1.4}.topology-netlist-view{background:#0f172a99;border:1px solid #ffffff0f;border-radius:10px;flex-direction:column;gap:10px;padding:12px 14px;display:flex}.netlist-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.netlist-title{color:#e2e8f0;align-items:center;gap:8px;font-size:12px;font-weight:600;display:flex}.math-badge{color:#a5b4fc;font-size:10.5px;font-family:var(--font-mono,monospace);background:#6366f11a;border:1px solid #6366f133;border-radius:6px;padding:3px 8px}.netlist-nodes-container{flex-wrap:wrap;gap:8px;display:flex}.microservice-chip{color:#f1f5f9;background:#1e293bcc;border:1px solid #ffffff1a;border-radius:8px;align-items:center;gap:6px;padding:5px 10px;font-size:11px;transition:all .2s;display:flex}.chip-ha{border-color:#10b98140}.chip-spof{background:#ef44440d;border-color:#ef444459}.chip-tier{color:#60a5fa;font-size:9.5px;font-weight:700}.chip-replicas{border-radius:4px;padding:1px 5px;font-size:10px}.replica-green{color:#34d399;background:#10b98126}.replica-warn{color:#f87171;background:#ef444426}.circuit-breaker-tag{color:#60a5fa;background:#a855f733;border:1px solid #a855f74d;border-radius:3px;padding:1px 4px;font-size:9px;font-weight:800}.cryptographic-passport-bar{background:#0006;border:1px solid #ffffff0f;border-radius:8px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;padding:8px 14px;display:flex}.passport-left{align-items:center;gap:8px;display:flex}.passport-icon{color:#38bdf8}.passport-label{color:#94a3b8;font-size:11px;font-weight:500}.passport-hash{font-family:var(--font-mono,monospace);color:#38bdf8;letter-spacing:.03em;background:#38bdf814;border-radius:4px;padding:2px 6px;font-size:11px}.passport-copy-btn{color:#cbd5e1;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:6px;align-items:center;gap:5px;padding:4px 10px;font-size:11px;font-weight:600;transition:all .2s;display:flex}.passport-copy-btn:hover{color:#fff;background:#ffffff1a}