*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{height:100vh;display:flex;flex-direction:column}:root{--primary: #2563eb;--primary-hover: #1d4ed8;--primary-light: #dbeafe;--primary-bg: rgba(37, 99, 235, .1);--background: #ffffff;--surface: #f9fafb;--border: #e5e7eb;--text-primary: #111827;--text-secondary: #6b7280;--text-muted: #9ca3af;--success: #10b981;--success-light: #d1fae5;--error: #ef4444;--error-light: #fee2e2;--danger: #ef4444;--warning: #f59e0b;--warning-light: #fef3c7;--info: #3b82f6;--info-light: #dbeafe;--chat-input-caret: #2563eb;--chat-input-focus-shadow: rgba(37, 99, 235, .15)}.header{background:var(--background);border-bottom:1px solid var(--border);padding:1rem 2rem;box-shadow:0 1px 3px #0000001a}.header-content{max-width:1280px;margin:0 auto;display:flex;align-items:center;justify-content:space-between}.header-left{display:flex;align-items:center;gap:1rem}.header-logo{height:40px;max-width:120px;object-fit:contain}.header-title{font-size:1.5rem;font-weight:700;color:var(--text-primary);margin:0;display:flex;align-items:center;gap:.75rem}.version-badge{font-size:.75rem;font-weight:600;font-family:Monaco,Consolas,Source Code Pro,monospace;background:linear-gradient(135deg,var(--primary) 0%,var(--primary-hover) 100%);color:#fff;padding:.25rem .5rem;border-radius:.375rem;border:1px solid var(--primary-hover);box-shadow:0 1px 2px #0000000d;cursor:help;transition:all .2s ease;letter-spacing:.025em}.version-badge:hover{background:linear-gradient(135deg,var(--primary-hover) 0%,#1e40af 100%);transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.header-center{display:flex;align-items:center}.statistics-counter{display:flex;flex-direction:column;align-items:center;gap:.25rem}.statistics-label{font-size:.75rem;color:var(--text-secondary);text-transform:uppercase;font-weight:500}.statistics-value{font-size:1.25rem;font-weight:700;color:var(--primary)}.header-right{display:flex;align-items:center;gap:1rem}.about-button{display:flex;align-items:center;gap:.5rem;background:var(--primary);color:#fff;border:none;border-radius:.375rem;padding:.5rem 1rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:background-color .2s}.about-button:hover{background:var(--primary-hover)}.main-container{flex:1;display:flex;max-width:1400px;margin:0 auto;width:100%;gap:2rem;padding:2rem;height:calc(100vh - 120px)}.config-panel{width:400px;min-width:400px;background:var(--surface);border-radius:.5rem;border:1px solid var(--border);height:100%;overflow:hidden;display:flex;flex-direction:column}.chat-panel{flex:1;min-width:0;height:100%}.agent-config-panel{height:100%;display:flex;flex-direction:column}.config-header{padding:1.5rem 1.5rem 1rem;border-bottom:1px solid var(--border);background:var(--background)}.config-title{display:flex;align-items:center;gap:.5rem;font-size:1.125rem;font-weight:600;color:var(--text-primary);margin:0}.config-content{flex:1;padding:1.5rem;overflow-y:auto}.form-group{margin-bottom:1.5rem}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.form-label{display:flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:500;color:var(--text-primary);margin-bottom:.5rem}.form-input,.form-select{width:100%;padding:.625rem;border:1px solid var(--border);border-radius:.375rem;font-size:.875rem;background:var(--background);color:var(--text-primary);transition:border-color .2s,box-shadow .2s}.form-input:focus,.form-select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light)}.form-input:disabled,.form-select:disabled{background:var(--surface);color:var(--text-muted);cursor:not-allowed}.form-textarea{width:100%;padding:.625rem;border:1px solid var(--border);border-radius:.375rem;font-size:.875rem;background:var(--background);color:var(--text-primary);font-family:inherit;resize:vertical;min-height:120px;transition:border-color .2s,box-shadow .2s}.form-textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light)}.form-textarea:disabled{background:var(--surface);color:var(--text-muted);cursor:not-allowed}.tools-list{display:flex;flex-direction:column;gap:.75rem}.tool-item{padding:.75rem;border:1px solid var(--border);border-radius:.375rem;background:var(--background)}.checkbox-label{display:flex;align-items:flex-start;gap:.75rem;cursor:pointer;user-select:none}.checkbox-label input[type=checkbox]{opacity:0;position:absolute;pointer-events:none}.checkbox-custom{width:18px;height:18px;border:2px solid var(--border);border-radius:.25rem;background:var(--background);position:relative;transition:all .2s;flex-shrink:0;margin-top:.125rem}.checkbox-label input[type=checkbox]:checked+.checkbox-custom{background:var(--primary);border-color:var(--primary)}.checkbox-label input[type=checkbox]:checked+.checkbox-custom:after{content:"";position:absolute;left:5px;top:2px;width:4px;height:8px;border:2px solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.checkbox-label input[type=checkbox]:disabled+.checkbox-custom{background:var(--surface);border-color:var(--border);opacity:.5;cursor:not-allowed}.tool-info{display:flex;flex-direction:column;gap:.25rem}.tool-name{font-weight:500;color:var(--text-primary);font-size:.875rem}.tool-description{font-size:.75rem;color:var(--text-secondary)}.config-status{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--border)}.status-indicator{display:flex;align-items:center;gap:.5rem}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--success)}.status-dot.updating{background:var(--warning);animation:pulse 1.5s ease-in-out infinite}.status-text{font-size:.75rem;color:var(--text-secondary)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.save-changes-section{margin-top:1rem;padding:1rem;background:var(--warning-bg, #fffbeb);border:1px solid var(--warning, #f59e0b);border-radius:.5rem;animation:slideIn .3s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.changes-indicator{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem}.changes-dot{width:8px;height:8px;border-radius:50%;background:var(--warning, #f59e0b);animation:pulse 1.5s ease-in-out infinite}.changes-text{font-size:.875rem;color:var(--warning-text, #92400e);font-weight:500}.save-actions{display:flex;gap:.75rem;justify-content:flex-end}.btn-discard{padding:.5rem 1rem;background:transparent;color:var(--text-secondary);border:1px solid var(--border);border-radius:.375rem;font-size:.875rem;cursor:pointer;transition:all .2s ease}.btn-discard:hover:not(:disabled){background:var(--surface-hover, #f8f9fa);color:var(--text-primary)}.btn-discard:disabled{opacity:.5;cursor:not-allowed}.btn-save{padding:.5rem 1rem;background:var(--primary);color:#fff;border:1px solid var(--primary);border-radius:.375rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease}.btn-save:hover:not(:disabled){background:var(--primary-hover, #2563eb);border-color:var(--primary-hover, #2563eb)}.btn-save:disabled{opacity:.5;cursor:not-allowed}.status-dot.changes{background:var(--warning, #f59e0b);animation:pulse 1.5s ease-in-out infinite}.token-count{font-size:.75rem;color:var(--text-muted);font-weight:400;margin-left:.5rem}.sidebar{width:300px;background:var(--surface);border-radius:.5rem;border:1px solid var(--border);padding:1.5rem;height:fit-content;max-height:calc(100vh - 200px);overflow-y:auto}.main-content{flex:1;display:flex;flex-direction:column;gap:1.5rem}.card{background:var(--background);border:1px solid var(--border);border-radius:.5rem;box-shadow:0 1px 3px #0000001a;padding:1.5rem}.card-header{margin-bottom:1rem}.card-title{font-size:1.25rem;font-weight:600;color:var(--text-primary);margin-bottom:.5rem}.card-description{font-size:.875rem;color:var(--text-secondary)}.btn{display:inline-flex;align-items:center;gap:.5rem;border:none;border-radius:.375rem;padding:.5rem 1rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s;text-decoration:none}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover:not(:disabled){background:var(--primary-hover)}.btn-secondary{background:var(--surface);color:var(--text-primary);border:1px solid var(--border)}.btn-secondary:hover:not(:disabled){background:var(--border)}.btn-danger{background:var(--error);color:#fff}.btn-danger:hover:not(:disabled){background:#dc2626}.btn-success{background:var(--success);color:#fff}.btn-success:hover:not(:disabled){background:#059669}.btn-sm{padding:.375rem .75rem;font-size:.75rem}.btn-lg{padding:.75rem 1.5rem;font-size:1rem}.form-group{margin-bottom:1rem}.form-label{display:block;font-size:.875rem;font-weight:500;color:var(--text-primary);margin-bottom:.5rem}.form-input,.form-textarea,.form-select{width:100%;background:var(--background);border:1px solid var(--border);border-radius:.375rem;padding:.75rem;font-size:.875rem;color:var(--text-primary);transition:border-color .2s}.form-input:focus,.form-textarea:focus,.form-select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #2563eb1a}.form-textarea{resize:vertical;min-height:100px}.form-help{font-size:.75rem;color:var(--text-muted);margin-top:.25rem}.chat-container{display:flex;flex-direction:column;height:calc(100vh - 200px)}.chat-messages{flex:1;overflow-y:auto;padding:1rem;background:var(--surface);border-radius:.5rem;margin-bottom:1rem;display:flex;flex-direction:column;justify-content:flex-start}.chat-message{margin-bottom:1rem;display:flex;gap:.75rem}.chat-message.user{flex-direction:row-reverse}.chat-message.user .message-content{background:var(--primary);color:#fff}.chat-message.assistant .message-content{background:var(--background);border:1px solid var(--border)}.message-content{max-width:70%;padding:.75rem 1rem;border-radius:1rem;font-size:.875rem;line-height:1.5}.message-time{font-size:.75rem;color:var(--text-muted);margin-top:.25rem;text-align:center}.chat-input-container{display:flex;gap:.75rem;align-items:flex-end;padding:1rem;border-top:1px solid var(--border);background:var(--background)}.chat-input{flex:1;min-height:48px;max-height:120px;resize:none;padding:.75rem 1rem;border:2px solid var(--border);border-radius:.75rem;font-size:.9rem;background:var(--background);color:var(--text-primary);font-family:inherit;line-height:1.4;transition:all .2s ease;caret-color:var(--primary);outline:none}.chat-input::placeholder{color:var(--text-muted);opacity:.7}.chat-input:focus{border-color:var(--primary);box-shadow:0 0 0 3px #2563eb1a;background:var(--background)}.chat-input:disabled{background:var(--surface);color:var(--text-muted);cursor:not-allowed;border-color:var(--border);opacity:.6}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;color:var(--text-secondary)}.loading-spinner{width:2rem;height:2rem;border:2px solid var(--border);border-top:2px solid var(--primary);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem}.modal-content{background:var(--background);border-radius:.5rem;box-shadow:0 10px 25px #0000001a;max-width:500px;width:100%;max-height:80vh;overflow-y:auto}.modal-header{padding:1.5rem 1.5rem 1rem;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}.modal-title{font-size:1.25rem;font-weight:600;color:var(--text-primary);margin:0}.modal-close{background:none;border:none;font-size:1.5rem;color:var(--text-muted);cursor:pointer;padding:0;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;border-radius:.25rem;transition:background-color .2s}.modal-close:hover{background:var(--surface)}.modal-body{padding:1.5rem}.modal-text{font-size:.875rem;line-height:1.6;color:var(--text-primary);margin-bottom:1rem}.modal-text:last-child{margin-bottom:0}.modal-text strong{font-weight:600;color:var(--text-primary)}.modal-text ul{margin-left:1.5rem;margin-top:.5rem}.modal-text li{margin-bottom:.25rem}.error-message{background:var(--error-light);color:var(--error);padding:.75rem 1rem;border-radius:.375rem;border:1px solid var(--error);font-size:.875rem;margin-bottom:1rem}.success-message{background:var(--success-light);color:var(--success);padding:.75rem 1rem;border-radius:.375rem;border:1px solid var(--success);font-size:.875rem;margin-bottom:1rem}@media (max-width: 768px){.header{padding:1rem}.header-content{flex-direction:column;gap:1rem;align-items:stretch}.header-center{justify-content:center}.main-container{flex-direction:column;padding:1rem}.sidebar{width:100%;max-height:none}.message-content{max-width:85%}}.chat-input-container .btn{min-height:48px;border-radius:.75rem;padding:0 1.25rem;font-weight:600;transition:all .2s ease}.chat-input-container .btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #2563eb4d}.chat-input-container .btn:active:not(:disabled){transform:translateY(0)}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:0}}.chat-input:focus{animation:none}.chat-input:focus-visible{border-color:var(--primary);box-shadow:0 0 0 4px #2563eb26}.chat-input:hover:not(:disabled):not(:focus){border-color:#2563eb4d;background:#f9fafbcc}.text-center{text-align:center}.text-sm{font-size:.875rem}.text-xs{font-size:.75rem}.font-bold{font-weight:700}.font-semibold{font-weight:600}.font-medium{font-weight:500}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-4{gap:1rem}.w-full{width:100%}.tool-prompt-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.toggle-button{background:var(--primary);color:#fff;border:none;border-radius:.375rem;padding:.375rem .75rem;font-size:.75rem;font-weight:500;cursor:pointer;transition:background-color .2s}.toggle-button:hover{background:var(--primary-hover)}.tool-prompt-section{border:1px solid var(--border);border-radius:.5rem;padding:1rem;background:var(--surface)}.tool-prompt-description{font-size:.875rem;color:var(--text-secondary);margin-bottom:1rem;line-height:1.4}.tool-prompt-actions{display:flex;gap:.5rem;margin-bottom:1rem}.btn-secondary{background:var(--surface);color:var(--text-primary);border:1px solid var(--border);border-radius:.375rem;padding:.375rem .75rem;font-size:.75rem;font-weight:500;cursor:pointer;transition:all .2s}.btn-secondary:hover{background:var(--border)}.btn-secondary:disabled{opacity:.5;cursor:not-allowed}.tool-prompt-textarea{font-family:SF Mono,Monaco,Cascadia Code,Roboto Mono,Consolas,Courier New,monospace;font-size:.8rem;line-height:1.4}.default-prompt-preview{margin-top:1rem}.default-prompt-preview summary{cursor:pointer;font-size:.875rem;font-weight:500;color:var(--text-secondary);padding:.5rem 0}.default-prompt-preview summary:hover{color:var(--primary)}.default-prompt-content{background:var(--background);border:1px solid var(--border);border-radius:.375rem;padding:.75rem;font-family:SF Mono,Monaco,Cascadia Code,Roboto Mono,Consolas,Courier New,monospace;font-size:.75rem;line-height:1.4;color:var(--text-primary);white-space:pre-wrap;margin-top:.5rem;max-height:200px;overflow-y:auto}.individual-tool-prompt{margin-bottom:1.5rem;padding:1rem;background:var(--background);border:1px solid var(--border);border-radius:.5rem}.individual-tool-prompt:last-child{margin-bottom:0}.tool-prompt-header-inline{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.tool-prompt-title{margin:0;font-size:1rem;font-weight:600;color:var(--text-primary)}.btn-restore-default{padding:.375rem .75rem;background:var(--background-secondary);color:var(--text-primary);border:1px solid var(--border);border-radius:.375rem;font-size:.875rem;cursor:pointer;transition:all .2s}.btn-restore-default:hover:not(:disabled){background:var(--primary);color:#fff;border-color:var(--primary)}.btn-restore-default:disabled{opacity:.5;cursor:not-allowed}.individual-tool-prompt .form-textarea{margin-bottom:0;width:100%}.model-config-grid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:1rem;margin-bottom:1.5rem;padding:1rem;background:var(--background-secondary);border:1px solid var(--border);border-radius:.5rem}.form-group-compact{display:flex;flex-direction:column;gap:.25rem}.form-label-compact{font-size:.75rem;font-weight:500;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.025em}.form-select-compact,.form-input-compact{padding:.375rem .5rem;font-size:.875rem;border:1px solid var(--border);border-radius:.25rem;background:var(--background);color:var(--text-primary);transition:border-color .2s}.form-select-compact:focus,.form-input-compact:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px #6366f11a}.tool-with-prompt{margin-bottom:1rem;border:1px solid var(--border);border-radius:.5rem;overflow:hidden}.tool-with-prompt:last-child{margin-bottom:0}.tool-header{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;background:var(--background-secondary)}.checkbox-label{display:flex;align-items:center;gap:.75rem;cursor:pointer;flex:1}.btn-customize{padding:.25rem .5rem;background:transparent;color:var(--text-secondary);border:1px solid var(--border);border-radius:.25rem;font-size:.75rem;cursor:pointer;transition:all .2s}.btn-customize:hover{background:var(--primary);color:#fff;border-color:var(--primary)}.tool-prompt-content{padding:1rem;background:var(--background);border-top:1px solid var(--border)}.prompt-actions{display:flex;justify-content:flex-end;margin-bottom:.5rem}.btn-restore-small{padding:.25rem .5rem;background:var(--background-secondary);color:var(--text-primary);border:1px solid var(--border);border-radius:.25rem;font-size:.75rem;cursor:pointer;transition:all .2s}.btn-restore-small:hover:not(:disabled){background:var(--primary);color:#fff;border-color:var(--primary)}.btn-restore-small:disabled{opacity:.5;cursor:not-allowed}.tool-prompt-content .form-textarea{font-size:.875rem}.system-prompt-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}@media (max-width: 480px){.model-config-grid{grid-template-columns:1fr;grid-template-rows:repeat(4,1fr);gap:.75rem}}.message-content h1,.message-content h2,.message-content h3,.message-content h4,.message-content h5,.message-content h6{color:var(--text-primary);font-weight:600;margin:1em 0 .5em;line-height:1.3}.message-content h1{font-size:1.5em}.message-content h2{font-size:1.3em}.message-content h3{font-size:1.1em}.message-content h4,.message-content h5,.message-content h6{font-size:1em}.message-content p{margin:.75em 0;line-height:1.6}.message-content strong{font-weight:600;color:var(--text-primary)}.message-content em{font-style:italic;color:var(--text-secondary)}.message-content ul,.message-content ol{margin:.75em 0;padding-left:1.5em}.message-content li{margin:.25em 0;line-height:1.5}.message-content blockquote{border-left:4px solid var(--primary);background:var(--primary-bg);margin:1em 0;padding:.75em 1em;color:var(--text-secondary);font-style:italic}.message-content code{background:var(--surface);border:1px solid var(--border);border-radius:.25rem;padding:.125em .25em;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.875em;color:var(--text-primary)}.message-content pre{background:var(--surface);border:1px solid var(--border);border-radius:.5rem;padding:1em;margin:1em 0;overflow-x:auto;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.875em;line-height:1.4}.message-content pre code{background:none;border:none;padding:0;font-size:inherit}.message-content table{border-collapse:collapse;margin:1em 0;width:100%;overflow-x:auto;display:block;white-space:nowrap}.message-content th,.message-content td{border:1px solid var(--border);padding:.5em .75em;text-align:left}.message-content th{background:var(--surface);font-weight:600;color:var(--text-primary)}.message-content td{color:var(--text-secondary)}.message-content tr:nth-child(2n){background:var(--surface)}.message-content hr{border:none;border-top:1px solid var(--border);margin:1.5em 0}.message-content a{color:var(--primary)!important;text-decoration:underline;transition:color .2s}.message-content a:hover{color:var(--primary-hover)!important}.message-content>*:first-child{margin-top:0}.message-content>*:last-child{margin-bottom:0}