.agent-input{display:flex;align-items:flex-end;gap:var(--spacing-md);padding:var(--spacing-xl);background-color:var(--color-slate);position:relative;max-width:900px;margin:0 auto;width:100%}.agent-input:before{content:"";position:absolute;top:0;left:var(--spacing-xl);right:var(--spacing-xl);height:1px;background-color:var(--color-border);pointer-events:none}.agent-input .input-wrapper{flex:1;position:relative}.agent-input .hidden-file-input{display:none}.agent-input .attachment-strip{display:flex;flex-wrap:wrap;gap:var(--spacing-xs);margin-bottom:var(--spacing-sm)}.agent-input .attachment-chip{display:flex;align-items:center;gap:var(--spacing-xs);background-color:#00000040;border:1px solid rgba(228,228,228,.15);border-radius:var(--radius-md);padding:4px 6px;max-width:260px}.agent-input .attachment-thumb{width:28px;height:28px;border-radius:var(--radius-sm);object-fit:cover;flex-shrink:0}.agent-input .attachment-meta{display:flex;flex-direction:column;min-width:0}.agent-input .attachment-name{color:var(--color-white);font-size:var(--font-size-xs);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.agent-input .attachment-size{color:var(--color-text-muted);font-size:11px}.agent-input .remove-attachment{border:none;background:none;color:var(--color-text-muted);width:20px;height:20px;border-radius:var(--radius-full);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:16px;line-height:1;padding:0}.agent-input .remove-attachment:hover{background-color:#e4e4e41a;color:var(--color-white)}.agent-input .upload-error{margin:0 0 var(--spacing-xs) 0;color:var(--color-pink);font-size:var(--font-size-xs)}.agent-input textarea{width:100%;padding:var(--spacing-md);background-color:var(--color-input-bg);border:1px solid var(--color-border);border-radius:var(--radius-xl);resize:none;min-height:52px;max-height:200px;font-family:inherit;font-size:var(--font-size-base);color:var(--color-white);line-height:var(--line-height-normal);transition:border-color .2s ease,background-color .2s ease;box-sizing:border-box}.agent-input textarea::placeholder{color:var(--color-text-muted)}.agent-input textarea:focus{outline:none;border-color:var(--color-border-hover);background-color:var(--color-input-bg-focus)}.agent-input textarea:disabled{background-color:var(--color-surface-overlay);cursor:not-allowed;opacity:.6}.agent-input .command-menu{position:absolute;bottom:calc(100% + var(--spacing-sm));left:0;right:0;background-color:var(--color-black);border:1px solid rgba(228,228,228,.15);border-radius:var(--radius-lg);padding:var(--spacing-xs);box-shadow:0 8px 24px #0006;z-index:var(--z-dropdown);overflow:hidden}.agent-input .command-item{display:flex;align-items:center;gap:var(--spacing-md);width:100%;padding:var(--spacing-sm) var(--spacing-md);background:none;border:none;border-radius:var(--radius-md);cursor:pointer;text-align:left;transition:background-color .1s ease}.agent-input .command-item.is-selected{background-color:#e4e4e414}.agent-input .command-name{color:var(--color-cyan);font-family:var(--font-mono);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);flex-shrink:0}.agent-input .command-desc{color:#e4e4e480;font-size:var(--font-size-xs);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.agent-input .controls{display:flex;align-items:center;gap:var(--spacing-sm)}.agent-input .send-button,.agent-input .attach-button{border:none;border-radius:var(--radius-lg);cursor:pointer;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);transition:opacity .2s ease,background-color .2s ease;height:36px}.agent-input .send-button{padding:var(--spacing-sm) var(--spacing-lg);background-color:var(--color-cyan);color:var(--color-black)}.agent-input .attach-button{width:36px;display:inline-flex;align-items:center;justify-content:center;background-color:var(--color-input-bg);color:var(--color-cyan);border:1px solid var(--color-border);padding:0}.agent-input .send-button:hover:not(:disabled),.agent-input .attach-button:hover:not(:disabled){opacity:.8}.agent-input .attach-button:disabled,.agent-input .send-button:disabled{opacity:.4;cursor:not-allowed}@media(max-width:768px){.agent-input{padding:var(--spacing-md);gap:var(--spacing-sm)}.agent-input:before{left:var(--spacing-md);right:var(--spacing-md)}}.agent-message-list{flex:1;overflow-y:auto;position:relative}.messages-wrapper{max-width:900px;margin:0 auto;padding:var(--spacing-lg) var(--spacing-xl)}.messages-wrapper .agent-message+.agent-message{border-top:1px solid var(--color-border)}.list-controls{display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-md) 0}.load-more-btn,.toggle-tool-calls-btn{padding:var(--spacing-xs) var(--spacing-md);background:none;border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-muted);font-size:var(--font-size-xs);font-family:inherit;cursor:pointer;transition:all var(--transition-base) ease;display:flex;align-items:center;gap:6px}.load-more-btn:hover:not(:disabled),.toggle-tool-calls-btn:hover{color:var(--color-cyan);border-color:var(--color-cyan)}.toggle-tool-calls-btn.active{color:var(--color-cyan);border-color:rgba(var(--color-cyan-rgb),.3);background-color:rgba(var(--color-cyan-rgb),.05)}.load-more-btn:disabled{opacity:.5;cursor:default}.empty-state{display:flex;align-items:center;justify-content:center;min-height:200px;color:var(--color-text-muted);font-size:var(--font-size-base)}.scroll-to-bottom{position:absolute;bottom:var(--spacing-md);left:50%;transform:translate(-50%);padding:var(--spacing-sm);background-color:var(--color-surface-overlay);border:1px solid var(--color-border);border-radius:var(--radius-full);color:var(--color-white);cursor:pointer;transition:all .2s ease}.scroll-to-bottom:hover{background-color:var(--color-surface-overlay-hover)}.system-divider{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-lg) 0}.system-divider:before,.system-divider:after{content:"";flex:1;height:1px;background-color:#e4e4e41a}.divider-text{color:#e4e4e466;font-size:var(--font-size-xs);white-space:nowrap}.tool-call-row,.tool-result-row,.subagent-group{margin-left:44px;padding:2px 0}.tool-call-row{display:flex;align-items:center;gap:var(--spacing-sm)}.tool-call-icon{color:var(--color-text-muted);display:flex;align-items:center}.tool-call-names{display:flex;flex-wrap:wrap;gap:6px}.tool-name-badge{display:inline-flex;align-items:center;padding:2px 8px;background-color:rgba(var(--color-cyan-rgb),.08);border:1px solid rgba(var(--color-cyan-rgb),.15);border-radius:var(--radius-sm);color:var(--color-cyan);font-family:var(--font-mono);font-size:.75rem;line-height:1.5}.tool-result-header,.subagent-header{appearance:none;display:flex;align-items:center;width:100%;margin:0;background-color:rgba(var(--color-cyan-rgb),.04);border:1px solid rgba(var(--color-cyan-rgb),.1);border-radius:var(--radius-sm);color:inherit;cursor:pointer;transition:background-color var(--transition-fast) ease;font-family:inherit;line-height:normal;text-align:left}.tool-result-header{justify-content:space-between;padding:4px 10px}.subagent-header{gap:var(--spacing-sm);padding:6px 12px}.tool-result-header:hover,.subagent-header:hover{background-color:rgba(var(--color-cyan-rgb),.08)}.tool-result-info{display:flex;align-items:center;gap:var(--spacing-sm)}.tool-result-status{font-size:.75rem;font-weight:var(--font-weight-semibold)}.tool-result-status.success,.tool-status-icon.done{color:#4ade80}.tool-result-status.error,.tool-status-icon.error{color:var(--color-pink)}.tool-result-name,.attachment-file-meta{font-family:var(--font-mono);font-size:.75rem;color:var(--color-text-secondary)}.tool-result-time,.tool-elapsed{font-size:.75rem;color:var(--color-text-muted)}.tool-result-chevron,.subagent-chevron{color:var(--color-text-muted);transition:transform var(--transition-fast) ease;flex-shrink:0}.tool-result-chevron.expanded{transform:rotate(180deg)}.tool-result-output{margin-top:4px;border:1px solid rgba(var(--color-cyan-rgb),.1);border-radius:var(--radius-sm);overflow:hidden}.tool-result-output pre{margin:0;padding:var(--spacing-sm) var(--spacing-md);background-color:#0000004d;overflow-x:auto;max-height:300px;overflow-y:auto}.tool-result-output code{font-family:var(--font-mono);font-size:.75rem;color:var(--color-text-secondary);line-height:1.5;white-space:pre-wrap;word-break:break-word}.tool-result-error,.subagent-error{margin-top:4px;padding:var(--spacing-xs) var(--spacing-sm);background-color:#ef444414;border:1px solid rgba(239,68,68,.15);border-radius:var(--radius-sm);color:var(--color-pink);font-size:.75rem}.agent-message{display:flex;gap:var(--spacing-md);padding:var(--spacing-lg) 0}.message-avatar{flex-shrink:0}.avatar-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold)}.user-icon{background-color:var(--color-surface-overlay);color:var(--color-text-secondary)}.assistant-icon{background-color:var(--color-cyan);color:var(--color-black)}.message-body{flex:1;min-width:0}.message-role{font-size:var(--font-size-xs);color:var(--color-text-muted);margin-bottom:var(--spacing-xs);font-weight:var(--font-weight-medium)}.message-content{color:var(--color-white);font-size:var(--font-size-base);line-height:var(--line-height-relaxed);word-break:break-word}.message-content h1,.message-content h2,.message-content h3,.message-content h4,.message-content h5,.message-content h6{margin:var(--spacing-lg) 0 var(--spacing-sm) 0;font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight);color:var(--color-white);letter-spacing:0}.message-content h1{font-size:var(--font-size-xl)}.message-content h2{font-size:var(--font-size-lg)}.message-content h3{font-size:var(--font-size-md)}.message-content p{margin:var(--spacing-sm) 0;color:var(--color-white)}.message-content li{margin:var(--spacing-xs) 0}.message-content pre{background-color:#0006;border:1px solid rgba(228,228,228,.1);border-radius:var(--radius-md);padding:var(--spacing-md);overflow-x:auto;margin:var(--spacing-md) 0}.message-content code{font-family:var(--font-mono);font-size:.9em;color:var(--color-white)}.message-content pre code{background-color:transparent;padding:0}.message-content :not(pre)>code{background-color:#0006;border:1px solid rgba(228,228,228,.1);padding:2px 6px;border-radius:var(--radius-sm);color:var(--color-cyan)}.message-content ul,.message-content ol{margin:var(--spacing-sm) 0;padding-left:var(--spacing-lg);color:var(--color-white)}.message-content blockquote{border-left:4px solid var(--color-cyan);padding-left:var(--spacing-md);margin:var(--spacing-md) 0;color:#e4e4e4cc}.message-content a{color:var(--color-cyan);text-decoration:underline;transition:opacity .2s}.message-content a:hover{opacity:.8}.message-content table{border-collapse:collapse;margin:var(--spacing-md) 0;width:100%}.message-content th,.message-content td{border:1px solid rgba(228,228,228,.2);padding:var(--spacing-sm) var(--spacing-md);text-align:left;color:var(--color-white)}.message-content th{background-color:#0000004d;font-weight:var(--font-weight-semibold)}.message-content hr{border:none;border-top:1px solid rgba(228,228,228,.2);margin:var(--spacing-lg) 0}.message-content img{max-width:100%;height:auto;border-radius:var(--radius-md);margin:var(--spacing-sm) 0}.message-attachments{display:flex;flex-direction:column;gap:var(--spacing-sm);margin-bottom:var(--spacing-sm)}.attachment-item{display:flex;flex-direction:column;gap:var(--spacing-xs)}.attachment-image{max-width:min(480px,100%);max-height:420px;width:auto;height:auto;border-radius:var(--radius-md);border:1px solid rgba(228,228,228,.15);object-fit:contain;background-color:#0003}.attachment-image-placeholder{border-radius:var(--radius-md);border:1px dashed rgba(228,228,228,.2);background-color:#0003;color:var(--color-text-secondary);min-height:56px;padding:var(--spacing-sm);display:flex;align-items:center;justify-content:center;font-size:var(--font-size-sm)}.attachment-file-row{display:flex;flex-direction:column;gap:2px;border:1px solid rgba(228,228,228,.15);border-radius:var(--radius-md);background-color:#0003;padding:var(--spacing-sm)}.attachment-file-name{color:var(--color-white);font-size:var(--font-size-sm);word-break:break-word}.attachment-file-meta{color:var(--color-text-secondary);font-size:var(--font-size-xs)}.active-tools{display:flex;flex-direction:column;gap:6px;margin-top:var(--spacing-sm)}.active-tool{display:flex;align-items:center;gap:var(--spacing-sm);padding:4px 10px;border-radius:var(--radius-sm);font-size:.8rem;background-color:rgba(var(--color-cyan-rgb),.04);border:1px solid rgba(var(--color-cyan-rgb),.1);transition:opacity .3s ease}.active-tool.is-delegate{border-color:rgba(var(--color-cyan-rgb),.25);background-color:rgba(var(--color-cyan-rgb),.06)}.active-tool.is-done{opacity:.6}.active-tool.is-error{border-color:#ef444433;background-color:#ef44440d}.tool-spinner,.loading-spinner{width:14px;height:14px;border:2px solid rgba(var(--color-cyan-rgb),.2);border-top-color:var(--color-cyan);border-radius:50%;animation:agent-tool-spin .8s linear infinite;flex-shrink:0}@keyframes agent-tool-spin{to{transform:rotate(360deg)}}.tool-status-icon.done,.tool-status-icon.error{flex-shrink:0}.tool-label{color:var(--color-text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.is-delegate .tool-label{color:var(--color-cyan)}.tool-elapsed{font-variant-numeric:tabular-nums;flex-shrink:0;margin-left:auto}.message-content .streaming-cursor{color:var(--color-cyan);font-size:var(--font-size-base);animation:agent-blink 1s infinite;margin-left:2px}@keyframes agent-blink{0%,49%{opacity:1}50%,to{opacity:0}}.subagent-icon{color:var(--color-cyan);display:flex;align-items:center;flex-shrink:0}.subagent-name{color:var(--color-text-secondary);font-size:.8rem;font-weight:var(--font-weight-medium)}.subagent-count{color:var(--color-text-muted);font-size:.75rem}.subagent-chevron{margin-left:auto}.subagent-chevron.expanded{transform:rotate(90deg)}.subagent-messages{margin-top:4px;padding-left:var(--spacing-md);border-left:2px solid rgba(var(--color-cyan-rgb),.2)}.subagent-loading{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md);color:var(--color-text-muted);font-size:var(--font-size-sm)}.subagent-error{padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-xs)}.loading-container{display:flex;align-items:center;justify-content:center;height:100%;color:var(--color-text-muted)}.agent-welcome{display:flex;align-items:center;justify-content:center;height:100%;padding:var(--spacing-xl)}.welcome-content{text-align:center;max-width:420px}.welcome-icon{color:var(--color-cyan);margin-bottom:var(--spacing-lg)}.welcome-content h2{color:var(--color-white);font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);margin-bottom:var(--spacing-md);letter-spacing:0}.welcome-content p{color:var(--color-text-secondary);font-size:var(--font-size-base);line-height:var(--line-height-relaxed);margin-bottom:var(--spacing-xl)}.name-input{margin-bottom:var(--spacing-lg)}.name-input input{width:100%;padding:var(--spacing-md);background-color:var(--color-input-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);color:var(--color-white);font-size:var(--font-size-base);font-family:inherit}.name-input input::placeholder{color:var(--color-text-muted)}.name-input input:focus{outline:none;border-color:var(--color-border-hover);background-color:var(--color-input-bg-focus)}.create-button{padding:var(--spacing-md) var(--spacing-2xl);background-color:var(--color-cyan);color:var(--color-black);border:none;border-radius:var(--radius-lg);cursor:pointer;font-size:var(--font-size-base);font-weight:var(--font-weight-medium);transition:opacity .2s ease}.create-button:hover:not(:disabled){opacity:.8}.create-button:disabled{opacity:.5;cursor:not-allowed}.agent-onboarding{display:flex;flex-direction:column;height:100%}.onboarding-header{display:flex;justify-content:center;padding:var(--spacing-md);border-bottom:1px solid var(--color-border)}.status-badge{padding:var(--spacing-xs) var(--spacing-md);background-color:var(--color-surface-overlay);border-radius:var(--radius-full);font-size:var(--font-size-xs);color:var(--color-cyan);font-weight:var(--font-weight-medium)}.agent-header{flex-shrink:0;max-width:900px;margin:0 auto;width:100%;padding:var(--spacing-md) var(--spacing-xl) 0}.agent-info{display:flex;align-items:center;justify-content:space-between;padding-bottom:var(--spacing-md);border-bottom:1px solid var(--color-border)}.agent-name{color:var(--color-white);font-size:var(--font-size-base);font-weight:var(--font-weight-medium)}.header-links{display:flex;align-items:center;gap:var(--spacing-md)}.header-link{color:var(--color-text-muted);font-size:var(--font-size-sm);text-decoration:none;transition:color .2s ease}.header-link:hover{color:var(--color-cyan)}.header-btn{background:none;border:none;cursor:pointer;font-size:var(--font-size-sm);font-family:inherit;padding:0}.error-banner{position:absolute;bottom:80px;left:50%;transform:translate(-50%);padding:var(--spacing-sm) var(--spacing-lg);background-color:#ef444426;border:1px solid rgba(239,68,68,.3);border-radius:var(--radius-lg);color:#ef4444;font-size:var(--font-size-sm);max-width:600px;text-align:center}