:root{--color-primary: #6797CD;--color-secondary: #CCEBF8;--color-tertiary: #183767;--color-primary-100: #EBF3FA;--color-primary-200: #CCEBF8;--color-primary-300: #A8D4EF;--color-primary-400: #85BCE6;--color-primary-500: #6797CD;--color-primary-600: #4D7BB5;--color-primary-700: #355F9B;--color-primary-800: #234680;--color-primary-900: #183767;--color-neutral-0: #FFFFFF;--color-neutral-50: #F7F9FB;--color-neutral-100: #EEF2F6;--color-neutral-200: #D6DFE8;--color-neutral-300: #B8C6D4;--color-neutral-400: #8FA4B8;--color-neutral-500: #6B849A;--color-neutral-600: #4E6679;--color-neutral-700: #354D5E;--color-neutral-800: #1F3545;--color-neutral-900: #0F172A;--color-success: #18A05A;--color-success-light: #D4F0E2;--color-success-dark: #0E6B3C;--color-warning: #E8930A;--color-warning-light: #FEF0D6;--color-warning-dark: #9A5F04;--color-error: #D63B3B;--color-error-light: #FCE0E0;--color-error-dark: #9B1C1C;--color-info: #6797CD;--color-info-light: #DEEDF8;--color-info-dark: #183767;--color-bg-primary: #FFFFFF;--color-bg-secondary: #F7F9FB;--color-bg-tertiary: #EEF2F6;--color-bg-brand: #183767;--color-bg-brand-light: #EBF3FA;--color-border-light: #D6DFE8;--color-border-default: #B8C6D4;--color-border-strong: #8FA4B8;--color-border-brand: #6797CD;--color-text-primary: #183767;--color-text-secondary: #4E6679;--color-text-tertiary: #8FA4B8;--color-text-inverse: #FFFFFF;--color-text-brand: #6797CD;--font-heading: "Poppins", sans-serif;--font-body: "Nunito", sans-serif;--font-mono: "JetBrains Mono", "Fira Code", "Courier New", monospace;--text-xs: .6875rem;--text-sm: .8125rem;--text-base: .9375rem;--text-md: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--text-4xl: 2.25rem;--text-5xl: 3rem;--leading-tight: 1.25;--leading-snug: 1.375;--leading-normal: 1.5;--leading-relaxed: 1.625;--fw-extralight: 200;--fw-light: 300;--fw-regular: 400;--fw-medium: 500;--fw-semibold: 600;--fw-bold: 700;--fw-extrabold: 800;--fw-black: 900;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--space-20: 5rem;--space-24: 6rem;--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: .875rem;--radius-xl: 1.25rem;--radius-2xl: 1.75rem;--radius-full: 9999px;--sh-xs: 0 1px 2px rgba(24,55,103,.05);--sh-sm: 0 2px 4px rgba(24,55,103,.07), 0 1px 2px rgba(24,55,103,.04);--sh-md: 0 4px 12px rgba(24,55,103,.09), 0 2px 4px rgba(24,55,103,.05);--sh-lg: 0 8px 24px rgba(24,55,103,.11), 0 4px 8px rgba(24,55,103,.06);--shadow-sm: 0 2px 4px rgba(24,55,103,.07), 0 1px 2px rgba(24,55,103,.04);--shadow-md: 0 4px 12px rgba(24,55,103,.09), 0 2px 4px rgba(24,55,103,.05);--shadow-lg: 0 8px 24px rgba(24,55,103,.11), 0 4px 8px rgba(24,55,103,.06);--shadow-xl: 0 24px 48px -12px rgba(24,55,103,.18);--shadow-focus: 0 0 0 3px rgba(103,151,205,.3);--transition-fast: .15s ease;--transition-base: .2s ease;--transition-slow: .3s ease;--z-dropdown: 100;--z-sticky: 200;--z-overlay: 300;--z-modal: 400;--z-toast: 500}:root{--bg: #0F172A;--bg2: #1F3545;--bg3: #354D5E;--surface: rgba(103,151,205,.06);--surface2: rgba(103,151,205,.1);--border: rgba(103,151,205,.12);--border2: rgba(103,151,205,.2);--fg: #F7F9FB;--fg2: #8FA4B8;--fg3: #6B849A;--sidebar-bg: #183767;--dd-bg: #1F3545;--yaml-bg: rgba(0,0,0,.35);--accent: #6797CD;--accent2: #4D7BB5;--shadow: rgba(24,55,103,.5)}body.light{--bg: #F7F9FB;--bg2: #FFFFFF;--bg3: #EEF2F6;--surface: rgba(255,255,255,.92);--surface2: rgba(247,249,251,.96);--border: rgba(203,213,225,.55);--border2: rgba(148,163,184,.45);--fg: #183767;--fg2: #4E6679;--fg3: #8FA4B8;--sidebar-bg: #183767;--dd-bg: #FFFFFF;--yaml-bg: rgba(241,245,249,1);--shadow: rgba(24,55,103,.1)}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box;-webkit-font-smoothing:antialiased}body{background:var(--bg);color:var(--fg);font-family:Nunito,sans-serif;font-size:13px;overflow:hidden;transition:background .3s,color .3s}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#6797cd38;border-radius:9999px}::-webkit-scrollbar-thumb:hover{background:#6797cd66}.glass{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:background .3s,border .3s}.glass:hover{border-color:var(--border2)}.kpi-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:18px 18px 15px;position:relative;overflow:hidden;transition:transform .18s,box-shadow .18s,border-color .18s;cursor:default}.kpi-card:hover{transform:translateY(-2px);box-shadow:0 10px 28px #1837672e;border-color:var(--border2)}.kpi-geo{position:absolute;top:-20px;right:-20px;width:82px;height:82px;border-radius:50%;pointer-events:none}.kpi-icon{width:40px;height:40px;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;margin-bottom:12px;position:relative;z-index:1}.kpi-value{font-size:24px;font-weight:800;letter-spacing:-.04em;color:var(--fg);line-height:1;margin-bottom:4px}.kpi-label{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--fg2);margin-bottom:9px}.kpi-bar-track{height:2px;background:var(--border);border-radius:2px;margin-bottom:5px;overflow:hidden}.kpi-bar-fill{height:100%;border-radius:2px}.kpi-delta{font-size:10px;font-weight:600;display:flex;align-items:center;gap:5px}.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:14px 16px;position:relative;overflow:hidden;transition:all .2s}.stat-card:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(103,151,205,.45),transparent)}.stat-card:hover{border-color:var(--border2);background:var(--surface2)}.nav-item{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:var(--radius-md);font-size:12px;font-weight:500;color:#ccebf8a6;cursor:pointer;transition:all .15s;width:100%;text-align:left;background:none;border:none;font-family:Nunito,sans-serif}.nav-item:hover{color:#fff;background:#6797cd26}.nav-item.active{color:#fff;background:#6797cd38;border:1px solid rgba(103,151,205,.32)}body.light .nav-item{color:#ccebf8bf}body.light .nav-item:hover{color:#fff;background:#6797cd38}body.light .nav-item.active{color:#fff}.badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:9999px;font-size:10px;font-weight:700;letter-spacing:.04em;white-space:nowrap}.badge-blue{background:#6797cd24;color:#85bce6;border:1px solid rgba(103,151,205,.25)}.badge-green{background:#4d7bb526;color:#a8d4ef;border:1px solid rgba(77,123,181,.28)}.badge-red{background:#18376738;color:#ccebf8;border:1px solid rgba(24,55,103,.38)}.badge-amber{background:#85bce626;color:#4d7bb5;border:1px solid rgba(133,188,230,.28)}.badge-violet{background:#355f9b2e;color:#a8d4ef;border:1px solid rgba(53,95,155,.3)}.badge-cyan{background:#ccebf824;color:#4d7bb5;border:1px solid rgba(103,151,205,.22)}body.light .badge-blue{background:var(--color-primary-100);color:var(--color-primary-700);border-color:var(--color-primary-200)}body.light .badge-green{background:var(--color-primary-100);color:var(--color-primary-600);border-color:var(--color-primary-200)}body.light .badge-red{background:#1837671a;color:var(--color-tertiary);border-color:#18376738}body.light .badge-amber{background:var(--color-primary-100);color:var(--color-primary-700);border-color:var(--color-primary-300)}body.light .badge-violet{background:var(--color-primary-100);color:var(--color-tertiary);border-color:var(--color-primary-200)}body.light .badge-cyan{background:var(--color-secondary);color:var(--color-primary-700);border-color:var(--color-primary-300)}.data-table{width:100%;border-collapse:separate;border-spacing:0}.data-table th{padding:9px 13px;font-size:10px;font-weight:700;color:var(--fg3);text-transform:uppercase;letter-spacing:.08em;border-bottom:1px solid var(--border);text-align:left}.data-table td{padding:11px 13px;font-size:12px;color:var(--fg2);border-bottom:1px solid var(--border)}.data-table tr:hover td{background:var(--surface2);color:var(--fg)}.data-table tr:last-child td{border-bottom:none}.dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}.dot-green{background:#6797cd;box-shadow:0 0 6px #6797cd99}.dot-amber{background:#a8d4ef;box-shadow:0 0 6px #a8d4ef80}.dot-red{background:#183767;box-shadow:0 0 6px #18376780}.dot-blue{background:#6797cd;box-shadow:0 0 6px #6797cd99}.dot-pulse{animation:dpulse 2s infinite}@keyframes dpulse{0%,to{opacity:1}50%{opacity:.4}}.form-input{width:100%;padding:9px 12px;background:var(--surface2);border:1.5px solid var(--border2);border-radius:var(--radius-md);font-size:13px;color:var(--fg);font-family:Nunito,sans-serif;outline:none;transition:all .15s}.form-input::placeholder{color:var(--fg3)}.form-input:focus{border-color:var(--accent);box-shadow:var(--shadow-focus)}textarea.form-input{resize:vertical;min-height:88px;line-height:1.6}.form-label{display:block;font-size:11px;font-weight:600;color:var(--fg2);margin-bottom:5px;letter-spacing:.02em}.btn-primary{padding:9px 18px;background:#6797cd;color:#fff;border-radius:var(--radius-md);font-size:13px;font-weight:600;border:none;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center;gap:6px;font-family:Nunito,sans-serif}.btn-primary:hover{background:#4d7bb5;transform:translateY(-1px);box-shadow:0 6px 16px #6797cd4d}.btn-primary:active{background:#355f9b;transform:translateY(0);box-shadow:none}.btn-primary:disabled{opacity:.4;cursor:not-allowed;transform:none;box-shadow:none}.btn-secondary{padding:9px 18px;background:var(--surface2);color:var(--fg2);border-radius:var(--radius-md);font-size:13px;font-weight:500;border:1px solid var(--border2);cursor:pointer;transition:all .15s;display:inline-flex;align-items:center;gap:6px;font-family:Nunito,sans-serif}.btn-secondary:hover{color:var(--fg);background:var(--surface);border-color:var(--accent)}.btn-secondary:disabled{opacity:.4;cursor:not-allowed}.btn-success{padding:9px 18px;background:#355f9b;color:#fff;border-radius:var(--radius-md);font-size:13px;font-weight:600;border:none;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center;gap:6px;font-family:Nunito,sans-serif}.btn-success:hover{background:#234680;transform:translateY(-1px)}.btn-success:active{background:#183767;transform:translateY(0)}.btn-danger{padding:8px 14px;background:#1837671f;color:var(--fg);border:1px solid rgba(24,55,103,.35);border-radius:var(--radius-md);font-size:12px;font-weight:700;cursor:pointer;transition:all .15s;font-family:Nunito,sans-serif}.btn-danger:hover{background:#18376738;border-color:#18376780}.btn-ghost{padding:7px 13px;background:transparent;color:var(--fg2);border:1px solid var(--border2);border-radius:var(--radius-md);font-size:12px;font-weight:500;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center;gap:6px;font-family:Nunito,sans-serif}.btn-ghost:hover{color:var(--fg);background:var(--surface2);border-color:var(--accent)}.pill{display:inline-flex;align-items:center;padding:5px 14px;border-radius:9999px;font-size:12px;font-weight:500;cursor:pointer;border:1px solid var(--border2);background:transparent;color:var(--fg3);transition:all .15s;font-family:Nunito,sans-serif}.pill:hover{border-color:var(--accent);color:var(--fg)}.pill.selected{background:#6797cd2e;color:#ccebf8;border-color:#6797cd61}body.light .pill.selected{color:var(--color-tertiary);background:var(--color-primary-100)}.step-circle{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0;background:var(--surface2);color:var(--fg3)}.step-circle.done{background:#6797cd;color:#fff}.step-sep{width:18px;height:1px;background:var(--border);flex-shrink:0}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:24px;transition:background .3s,border .3s}.panel-title{font-size:14px;font-weight:700;color:var(--fg);margin-bottom:18px;letter-spacing:-.02em}.chat-bubble-user{background:#6797cd2e;border:1px solid rgba(103,151,205,.28);border-radius:var(--radius-xl) var(--radius-xl) var(--radius-sm) var(--radius-xl);padding:11px 15px;max-width:72%;font-size:13px;line-height:1.6}.chat-bubble-ai{background:var(--surface2);border:1px solid var(--border2);border-radius:var(--radius-xl) var(--radius-xl) var(--radius-xl) var(--radius-sm);padding:11px 15px;max-width:78%;font-size:13px;line-height:1.6}.approval-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:18px;transition:all .2s}.approval-card:hover{border-color:var(--border2);background:var(--surface2)}.yaml-block{background:var(--yaml-bg);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px;font-family:var(--font-mono);font-size:11.5px;line-height:1.8;color:var(--fg2);max-height:300px;overflow-y:auto}.dd-menu{position:absolute;top:calc(100% + 5px);left:0;right:0;background:var(--dd-bg);border:1px solid var(--border2);border-radius:var(--radius-lg);box-shadow:0 20px 40px var(--shadow);z-index:200;overflow:hidden}.dd-item{padding:10px 14px;font-size:12px;cursor:pointer;color:var(--fg2);transition:background .1s;display:flex;align-items:center;gap:8px}.dd-item:hover{background:var(--surface2);color:var(--fg)}.dd-item.sel{color:#85bce6;font-weight:600}.tab{padding:8px 15px;font-size:12px;font-weight:600;color:var(--fg3);cursor:pointer;border-bottom:2px solid transparent;transition:all .15s;background:none;border-top:none;border-left:none;border-right:none;font-family:Nunito,sans-serif}.tab:hover{color:var(--fg)}.tab.active{color:var(--accent);border-bottom-color:var(--accent)}.search-input{background:var(--surface2);border:1.5px solid var(--border2);border-radius:var(--radius-md);padding:7px 12px 7px 34px;font-size:12px;color:var(--fg);outline:none;transition:all .15s;font-family:Nunito,sans-serif}.search-input:focus{border-color:var(--accent);box-shadow:var(--shadow-focus)}.search-input::placeholder{color:var(--fg3)}.theme-toggle{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:var(--radius-md);cursor:pointer;width:100%;border:1px solid rgba(103,151,205,.22);background:#6797cd14;color:#ccebf8bf;font-size:12px;font-weight:500;transition:all .15s;margin-top:6px;font-family:Nunito,sans-serif}.theme-toggle:hover{color:#fff;background:#6797cd29;border-color:#6797cd59}.sidebar-action{display:flex;align-items:center;gap:8px;padding:7px 12px;border-radius:var(--radius-md);cursor:pointer;border:1px solid rgba(103,151,205,.18);background:#6797cd12;color:#ccebf8a6;font-size:12px;font-weight:500;transition:all .15s;font-family:Nunito,sans-serif;width:100%}.sidebar-action:hover{color:#fff;background:#6797cd26}.kpi-bg-a{background:#ebf3fa}.kpi-bg-b{background:#e2edf7}.kpi-bg-c{background:#f1f4f8}.kpi-bg-d{background:#1837670f}body:not(.light) .kpi-bg-a{background:#6797cd1a}body:not(.light) .kpi-bg-b{background:#18376729}body:not(.light) .kpi-bg-c{background:#6797cd0f}body:not(.light) .kpi-bg-d{background:#18376738}body.light{--fg3: #6B849A}.nav-item{color:#ccebf8b8}.nav-item:hover{color:#fff}.token-badge{font-size:9px;padding:2px 6px;border-radius:9999px;background:#1837672e;color:#a8d4ef;font-family:var(--font-mono);font-weight:700}body.light .token-badge{background:#6797cd38;color:#183767}.fade-in{animation:fadeIn .22s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.spin{animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes slideInRight{0%{opacity:0;transform:translate(24px)}to{opacity:1;transform:translate(0)}}@keyframes slideOutRight{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(24px)}}.toast-enter{animation:slideInRight .22s ease}html,body,#root{height:100%;width:100%}body{overflow:hidden}.app-shell{display:grid;grid-template-columns:230px 1fr;height:100%}.app-content{overflow-y:auto;padding:20px 26px 32px;background:var(--bg)}.app-content-inner{max-width:1400px;margin:0 auto}.sidebar{background:var(--sidebar-bg);display:flex;flex-direction:column;padding:18px 14px;gap:4px;color:#ccebf8d9;border-right:1px solid rgba(103,151,205,.1)}.sidebar-brand{display:flex;align-items:center;gap:10px;padding:4px 6px 18px;border-bottom:1px solid rgba(103,151,205,.16);margin-bottom:12px}.sidebar-brand-logo{width:32px;height:32px;border-radius:9px;background:#6797cd33;display:flex;align-items:center;justify-content:center;color:#ccebf8;font-weight:800;font-family:Poppins,sans-serif}.sidebar-brand-title{font-family:Poppins,sans-serif;font-weight:700;font-size:14px;color:#fff;letter-spacing:-.02em}.sidebar-brand-sub{font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:#ccebf88c}.sidebar-section{padding:14px 8px 6px;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#ccebf873}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.page-title{font-family:Poppins,sans-serif;font-weight:700;font-size:22px;color:var(--fg);letter-spacing:-.02em}.page-subtitle{font-size:12px;color:var(--fg3);margin-top:4px}.section-title{font-family:Poppins,sans-serif;font-weight:700;font-size:14px;color:var(--fg);letter-spacing:-.02em;margin:14px 0 12px}.kpi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px;margin-bottom:22px}.two-col{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(380px,1fr))}.card-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.card-h h3{font-family:Poppins,sans-serif;font-weight:700;font-size:13px;color:var(--fg)}.crumb{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--fg3);margin-bottom:8px}.crumb a{color:var(--fg2);text-decoration:none}.crumb a:hover{color:var(--accent)}.crumb-sep{color:var(--fg3)}.tabs{display:flex;gap:4px;border-bottom:1px solid var(--border);margin-bottom:16px}.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 12px;color:var(--fg3);gap:10px}.empty-title{font-size:13px;color:var(--fg2);font-weight:600}.status-pill{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:9999px;font-size:10px;font-weight:700;letter-spacing:.03em}.live-pulse{width:8px;height:8px;border-radius:50%;background:#6797cd;box-shadow:0 0 8px #6797cdb3;animation:dpulse 1.6s infinite}.log-viewer{background:var(--yaml-bg);border:1px solid var(--border);border-radius:var(--radius-lg);padding:14px;font-family:var(--font-mono);font-size:11.5px;line-height:1.6;color:var(--fg2);height:480px;overflow-y:auto}.log-viewer .l-info{color:var(--fg2)}.log-viewer .l-warn{color:#a8d4ef}.log-viewer .l-error{color:#4d7bb5;font-weight:600}.log-line{display:flex;gap:8px;padding:2px 0}.log-time{color:var(--fg3);flex-shrink:0}.log-level{font-weight:700;flex-shrink:0;min-width:42px}.span-row{display:flex;align-items:center;gap:10px;padding:5px 0;font-size:11.5px}.span-name{color:var(--fg2);font-family:var(--font-mono)}.span-bar-track{flex:1;height:8px;background:var(--surface2);border-radius:4px;overflow:hidden;position:relative}.span-bar{height:100%;border-radius:4px}.span-bar.llm{background:#6797cd}.span-bar.mcp{background:#a8d4ef}.span-bar.nats{background:#355f9b}.span-bar.other{background:#8fa4b8}.span-dur{color:var(--fg3);font-family:var(--font-mono);font-size:10.5px;min-width:60px;text-align:right}.sparkline{width:100%;height:32px;margin-top:4px}.code-block{background:var(--yaml-bg);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px;font-family:var(--font-mono);font-size:11.5px;line-height:1.7;color:var(--fg2);white-space:pre;overflow:auto;max-height:540px}.loader-line{height:2px;background:var(--surface2);position:relative;overflow:hidden;border-radius:9999px}.loader-line:after{content:"";position:absolute;top:0;left:-30%;width:30%;height:100%;background:var(--accent);animation:slide 1.2s infinite linear}@keyframes slide{to{transform:translate(450%)}}@media (max-width: 900px){.app-shell{grid-template-columns:64px 1fr}.sidebar{padding:12px 6px}.sidebar .nav-item{justify-content:center;padding:8px;gap:0}.sidebar .nav-label,.sidebar-brand-title,.sidebar-brand-sub,.sidebar-section{display:none}}