:root{--bg: #0b0c0f;--bg2: #121318;--bg3: #1a1c22;--text: #e8e8ea;--text2: #8a8f98;--border: #2a2d33;--accent: #b4ff00;--pending: #ffc857;--done: #b4ff00;--font-display: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto}@keyframes slideIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}.app{display:flex;height:100vh;overflow:hidden}.sidebar{width:220px;min-width:220px;background:var(--bg2);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:20px 0;gap:4px}.logo{font-family:var(--font-display);font-size:20px;font-weight:800;color:var(--accent);letter-spacing:3px;padding:0 20px 20px;border-bottom:1px solid var(--border);margin-bottom:12px}.section-label{font-size:10px;letter-spacing:2px;color:var(--text2);padding:0 20px;margin-bottom:4px;text-transform:uppercase;text-align:center}.nav-list,.project-list{display:flex;flex-direction:column;gap:2px;padding:0 8px}a.project-item{text-decoration:none}.project-item{text-align:left;padding:8px 12px;background:none;color:var(--text2);border-radius:4px;transition:all .15s;font-size:15px}.project-item:hover{background:var(--bg3);color:var(--text)}.project-item.active{background:var(--bg3);color:var(--accent)}.project-agent{margin-left:6px;color:#36ff8a;font-size:12px}.new-project{padding:12px 12px 0;margin-top:8px}.new-project input{font-size:12px;padding:6px 10px}.sidebar-footer{margin-top:auto;padding:16px 20px;font-size:11px;color:var(--text2);border-top:1px solid var(--border);line-height:1.8}.agent-item{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;margin-top:6px}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:6px}.dot.online{width:10px;height:10px;background:#b4ff00;box-shadow:0 0 6px #b4ff00}.main{flex:1;overflow-y:auto;padding:32px;display:flex;flex-direction:column;gap:20px}.main-header{display:flex;align-items:center;justify-content:space-between}.header-actions{display:flex;align-items:center;gap:10px}.project-name{font-family:var(--font-display);font-size:28px;font-weight:800;color:var(--text);letter-spacing:1px}.feed-count{font-size:12px;color:var(--text2);letter-spacing:1px}.filters{display:flex;gap:4px}.filter-btn{padding:4px 12px;background:none;color:var(--text2);border:1px solid var(--border);border-radius:20px;font-size:11px;transition:all .15s}.filter-btn:hover{border-color:var(--text2);color:var(--text)}.filter-btn.active{border-color:var(--accent);color:var(--accent)}.new-task{display:flex;flex-direction:column;gap:12px;height:100%}.new-task-fields{flex:1;display:flex;flex-direction:column;gap:10px}.new-task textarea{flex:1;height:100%;min-height:0;resize:none}.drop-zone{flex:1;display:flex;min-height:0}.drop-zone textarea{flex:1;height:100%;box-sizing:border-box;resize:none;padding:18px;font-size:16px;line-height:1.6}.new-task-bottom{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:10px;flex-shrink:0}.new-task-bottom .file-icons{max-width:none;flex:1}.new-task-actions{display:flex;flex-direction:row;gap:10px;justify-content:flex-end;align-items:center;flex-shrink:0}.new-task-fields{flex:1.5;display:flex;flex-direction:column;gap:10px;min-height:0}.new-task-title{font-size:18px;font-weight:700;padding:7px 10px;background:var(--bg3);border:1px solid var(--border);border-radius:5px;color:var(--text);letter-spacing:.3px}.new-task-title:focus{outline:none;border-color:var(--accent)}.new-task-title::placeholder{color:var(--text2);font-weight:400}.new-task-agent{font-size:14px;padding:8px 10px;background:var(--bg3);border:1px solid var(--border);border-radius:5px;color:var(--text)}.new-task-agent:focus{outline:none;border-color:var(--accent)}textarea{resize:vertical;min-height:90px;line-height:1.5;padding:10px;font-family:inherit;background:var(--bg3);border:1px solid var(--border);border-radius:5px;color:var(--text);font-size:14px}textarea:focus{outline:none;border-color:var(--accent)}.btn-primary,.btn-send{padding:8px 16px;background:var(--accent);color:#000;font-weight:700;border-radius:4px;white-space:nowrap;transition:opacity .15s}.btn-primary:hover,.btn-send:hover{opacity:.85}.btn-primary:disabled,.btn-send:disabled{opacity:.4;cursor:not-allowed}.btn-reply-toggle,.btn-done{padding:3px 10px;background:none;border:1px solid var(--border);color:var(--text2);border-radius:3px;font-size:11px;cursor:pointer;transition:all .15s;color:#b4ff0033}.feed-comment-meta .btn-reply-toggle:first-of-type{margin-left:auto}.btn-reply-toggle:hover{border-color:var(--accent);color:var(--accent)}.btn-done:hover{border-color:var(--done);color:var(--done)}.task-list,.feed{display:flex;flex-direction:column;gap:10px}.empty{color:var(--text2);text-align:center;padding:60px 0;font-size:13px}.feed-task{background:var(--bg2);border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:8px;padding:14px 18px;cursor:pointer;transition:background .15s}.feed-task:hover{background:var(--bg3)}.feed-task-header{display:flex;align-items:center;gap:12px}.feed-task-icon{font-size:17px;color:var(--accent);flex-shrink:0;margin-right:8px}.feed-task-title{flex:1;font-size:16px;font-weight:700;color:var(--text);letter-spacing:.2px}.editable-title-input{background:transparent;border:1px solid var(--accent);border-radius:4px;color:var(--text);font-family:inherit;padding:2px 6px;outline:none;min-width:0}.feed-task-status{font-size:11px;font-weight:700;letter-spacing:1px;white-space:nowrap;margin-left:8px}.feed-task-desc{margin-top:10px;padding:10px 0 0 29px;border-top:1px solid var(--border);font-size:14px;color:var(--text2);line-height:1.7}.feed-comment{border-radius:8px;padding:14px 18px;line-height:1.65}.feed-comment-claude{background:#b4ff000d;border:1px solid rgba(180,255,0,.2);border-left:3px solid var(--accent)}.feed-comment-user{background:var(--bg2);border:1px solid var(--border);border-left:3px solid #4a9eff}.feed-comment-meta{display:flex;align-items:center;gap:10px;margin-bottom:8px}.feed-comment-author{font-size:11px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase}.feed-comment-claude .feed-comment-author{color:var(--accent)}.feed-comment-user .feed-comment-author{color:#4a9eff}.feed-comment-task{font-size:11px;color:var(--text2);letter-spacing:.3px}.feed-comment-date{margin-left:10px;font-size:11px;opacity:.6}.feed-comment-msg{font-size:15px;color:var(--text);line-height:1.6;white-space:pre-wrap;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.feed-reply-box{display:flex;flex-direction:row;gap:12px;align-items:flex-start;margin-top:10px}.feed-reply-box .reply-left{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px}.feed-reply-box textarea{width:100%;min-height:80px;box-sizing:border-box}.feed-reply-box .new-task-actions{flex-direction:column;justify-content:flex-start}.task-card{background:var(--bg2);border:1px solid var(--border);border-radius:8px;cursor:pointer;transition:border-color .15s;overflow:hidden}.task-card:hover{border-color:#444}.task-card.active{border-color:var(--accent)}.task-card.status-done{opacity:.5}.task-header{display:flex;align-items:center;gap:12px;padding:12px 16px}.task-status{font-size:11px;font-weight:700;white-space:nowrap;letter-spacing:.5px}.task-title{flex:1;color:var(--text);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.task-menu{display:flex;gap:10px;margin:16px 0}.task-menu button{background:none;border:1px solid #333;color:#aaa;padding:6px 12px;cursor:pointer}.task-menu button.active{border-color:var(--accent);color:var(--accent)}.drop-zone{position:relative}.drop-zone.dragover{outline:2px dashed var(--pending)}.file-icons{max-width:70%}.file-preview{position:relative;display:inline-block;margin:20px 6px 6px}.file-preview img{width:50px;height:50px;object-fit:cover;border-radius:6px;border:1px solid #333}.file-remove{position:absolute;top:-6px;right:-6px;background:#111;border:1px solid #444;border-radius:50%;width:20px;height:20px;color:#fff;cursor:pointer;font-size:12px}.file-icon{font-size:12px;opacity:.8}.comment-image{margin-top:6px;font-size:12px}.spinner{width:14px;height:14px;border:2px solid rgba(255,255,255,.2);border-top-color:#000;border-radius:50%;display:inline-block;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes agentEventFade{0%{opacity:0;transform:translate(-6px)}to{opacity:1;transform:translate(0)}}.typing-dots{display:inline-flex;align-items:center;gap:5px;padding:10px 12px}.typing-dots span{width:7px;height:7px;border-radius:50%;background:var(--text2);display:inline-block;animation:typingDot 1.4s infinite ease-in-out both}.typing-dots span:nth-child(1){animation-delay:0s}.typing-dots span:nth-child(2){animation-delay:.2s}.typing-dots span:nth-child(3){animation-delay:.4s}@keyframes typingDot{0%,80%,to{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-4px)}}.agent-event-message{display:inline;animation:agentEventFade .35s ease forwards}.file-icon-wrapper{position:relative;display:inline-block}.file-preview-popup{position:absolute;bottom:30px;left:0;z-index:100;padding:4px;background:var(--bg2);border:1px solid var(--border);border-radius:6px}.file-preview-popup img{max-width:240px;max-height:180px;display:block;border-radius:4px}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px}.project-select{min-width:260px;padding:10px 14px;background:var(--bg2);border:1px solid var(--border);color:var(--text);border-radius:6px;font-size:14px;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,var(--text2) 50%),linear-gradient(135deg,var(--text2) 50%,transparent 50%);background-position:calc(100% - 16px) calc(50% - 3px),calc(100% - 11px) calc(50% - 3px);background-size:5px 5px;background-repeat:no-repeat}.project-select:hover{border-color:var(--accent)}.section-label.inline{padding:0;margin:0 0 4px;font-size:11px;letter-spacing:1.5px}.metrics-table-wrapper{margin-top:24px}.metrics-table{width:100%;border-collapse:collapse;background:var(--bg2);border:1px solid var(--border)}.metrics-table thead{background:var(--bg3)}.metrics-table th{text-align:left;font-size:12px;color:var(--text2);padding:10px 14px;border-bottom:1px solid var(--border)}.metrics-table td{padding:12px 14px;border-bottom:1px solid var(--border);font-size:14px}.metrics-table tbody tr:hover{background:#78ff780d}.metrics-empty{margin-top:30px;color:var(--text2)}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{width:90vw;height:90vh;max-width:1400px;background:var(--bg);padding:16px 20px;border-radius:12px;position:relative;display:flex;flex-direction:column}.modal-close{position:absolute;top:10px;right:10px;background:transparent;border:none;font-size:18px;cursor:pointer}@media (max-width: 768px){.sidebar{position:fixed;left:0;top:0;height:100vh;width:80vw;max-width:300px;min-width:0;transform:translate(-100%);transition:transform .25s ease;z-index:1001}.sidebar.open{transform:translate(0)}.main{padding:12px 16px 16px}.project-name{text-align:center;font-size:20px;line-height:40px;min-height:40px;padding:0 48px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-toggle{position:fixed;top:12px;left:12px;z-index:1002;width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--bg2);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:18px;line-height:1;cursor:pointer}.sidebar-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;z-index:1000}.modal-content{width:100vw;height:100dvh;max-width:none;max-height:100dvh;border-radius:0}}@media (max-width: 768px){.main-header{flex-direction:column;align-items:stretch;gap:12px}.header-actions{flex-direction:column;align-items:stretch;width:100%}.header-actions button{width:100%;justify-content:center}.header-actions .chat-btn{order:-1}}