:root{--color-bg: #0f0f0f;--color-surface: #1a1a1a;--color-surface-hover: #252525;--color-border: #333;--color-text: #e5e5e5;--color-text-dim: #888;--color-primary: #6366f1;--color-primary-hover: #818cf8;--color-success: #22c55e;--color-warning: #f59e0b;--color-error: #ef4444;--color-cyan: #06b6d4;--radius: 8px;--shadow: 0 4px 6px -1px rgb(0 0 0 / .3)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--color-bg);color:var(--color-text);line-height:1.6}.app{max-width:900px;margin:0 auto;padding:24px;min-height:100vh}.header{text-align:center;margin-bottom:32px;padding-bottom:24px;border-bottom:1px solid var(--color-border)}.header h1{font-size:2rem;font-weight:700;color:var(--color-primary);margin-bottom:8px}.header p{color:var(--color-text-dim);font-size:.95rem}.add-task-form{display:flex;gap:12px;margin-bottom:32px}.add-task-input{flex:1;padding:14px 18px;font-size:1rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);color:var(--color-text);transition:border-color .2s,box-shadow .2s}.add-task-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #6366f133}.add-task-input::placeholder{color:var(--color-text-dim)}.btn{padding:14px 24px;font-size:1rem;font-weight:600;border:none;border-radius:var(--radius);cursor:pointer;transition:background .2s,transform .1s}.btn:active{transform:scale(.98)}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover{background:var(--color-primary-hover)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{background:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border)}.btn-secondary:hover{background:var(--color-surface-hover)}.btn-success{background:var(--color-success);color:#fff}.btn-success:hover{background:#16a34a}.btn-small{padding:8px 16px;font-size:.875rem}.task-list{display:flex;flex-direction:column;gap:16px}.task-list-empty{text-align:center;padding:48px;color:var(--color-text-dim)}.task-list-empty p{margin-bottom:8px}.task-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);overflow:hidden;transition:box-shadow .2s}.task-card:hover{box-shadow:var(--shadow)}.task-card-header{padding:16px 20px;display:flex;align-items:center;justify-content:space-between;cursor:pointer}.task-card-title{display:flex;align-items:center;gap:12px}.task-card-title h3{font-size:1.1rem;font-weight:600}.task-status{padding:4px 10px;font-size:.75rem;font-weight:600;text-transform:uppercase;border-radius:4px}.status-pending{background:var(--color-surface-hover);color:var(--color-text-dim)}.status-researching,.status-planning{background:#06b6d433;color:var(--color-cyan)}.status-awaiting_input{background:#f59e0b33;color:var(--color-warning)}.status-in_progress{background:#6366f133;color:var(--color-primary)}.status-blocked{background:#ef444433;color:var(--color-error)}.status-completed{background:#22c55e33;color:var(--color-success)}.task-card-expand{color:var(--color-text-dim);font-size:1.2rem}.task-card-body{padding:0 20px 20px;border-top:1px solid var(--color-border)}.progress-section{margin-top:16px}.progress-bar-container{display:flex;align-items:center;gap:12px;margin-top:8px}.progress-bar{flex:1;height:8px;background:var(--color-surface-hover);border-radius:4px;overflow:hidden}.progress-bar-fill{height:100%;background:var(--color-primary);transition:width .3s ease}.progress-text{font-size:.875rem;color:var(--color-text-dim);min-width:45px}.ai-plan{margin-top:20px;padding:16px;background:#6366f11a;border:1px solid rgba(99,102,241,.2);border-radius:var(--radius)}.ai-plan h4{font-size:.9rem;color:var(--color-primary);margin-bottom:12px;display:flex;align-items:center;gap:8px}.ai-plan-approach{color:var(--color-text);margin-bottom:16px;line-height:1.7}.ai-plan-section{margin-top:16px}.ai-plan-section h5{font-size:.85rem;color:var(--color-text-dim);margin-bottom:8px}.proposed-subtask{display:flex;align-items:flex-start;gap:8px;padding:8px 0;border-bottom:1px solid var(--color-border)}.proposed-subtask:last-child{border-bottom:none}.proposed-subtask-icon{font-size:1rem;margin-top:2px}.proposed-subtask-content{flex:1}.proposed-subtask-title{font-weight:500}.proposed-subtask-desc{font-size:.85rem;color:var(--color-text-dim)}.ai-plan-actions{display:flex;gap:12px;margin-top:20px}.subtasks-section{margin-top:20px}.subtasks-section h4{font-size:.9rem;color:var(--color-text-dim);margin-bottom:12px}.subtask-item{display:flex;align-items:center;gap:12px;padding:12px;background:var(--color-surface-hover);border-radius:var(--radius);margin-bottom:8px;cursor:pointer;transition:background .2s}.subtask-item:hover{background:#2a2a2a}.subtask-item.completed{opacity:.6}.subtask-checkbox{width:20px;height:20px;border:2px solid var(--color-border);border-radius:4px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.subtask-checkbox.checked{background:var(--color-success);border-color:var(--color-success)}.subtask-checkbox.checked:after{content:"✓";color:#fff;font-size:12px;font-weight:700}.subtask-content{flex:1}.subtask-title{font-weight:500}.subtask-title.completed{text-decoration:line-through;color:var(--color-text-dim)}.subtask-meta{font-size:.8rem;color:var(--color-text-dim);display:flex;gap:12px;margin-top:4px}.subtask-icon{font-size:1rem}.metrics-section{margin-top:20px}.metrics-section h4{font-size:.9rem;color:var(--color-text-dim);margin-bottom:12px}.metric-item{display:flex;align-items:center;gap:12px;padding:12px;background:var(--color-surface-hover);border-radius:var(--radius);margin-bottom:8px}.metric-info{flex:1}.metric-name{font-weight:500;margin-bottom:4px}.metric-bar{height:6px;background:var(--color-border);border-radius:3px;overflow:hidden}.metric-bar-fill{height:100%;background:var(--color-cyan);transition:width .3s}.metric-value{font-size:.875rem;color:var(--color-text-dim);min-width:80px;text-align:right}.metric-input{display:flex;gap:8px;align-items:center}.metric-input input{width:80px;padding:6px 10px;font-size:.875rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:4px;color:var(--color-text)}.metric-input input:focus{outline:none;border-color:var(--color-primary)}.questions-section{margin-top:20px}.questions-section h4{font-size:.9rem;color:var(--color-warning);margin-bottom:12px}.question-item{padding:12px;background:#f59e0b1a;border:1px solid rgba(245,158,11,.2);border-radius:var(--radius);margin-bottom:8px}.question-text{font-weight:500;margin-bottom:8px}.question-input{display:flex;gap:8px}.question-input input{flex:1;padding:8px 12px;font-size:.875rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:4px;color:var(--color-text)}.question-input input:focus{outline:none;border-color:var(--color-primary)}.question-answered{color:var(--color-success);font-style:italic}.loading{display:flex;align-items:center;gap:12px;padding:16px;color:var(--color-cyan)}.loading-spinner{width:20px;height:20px;border:2px solid var(--color-border);border-top-color:var(--color-cyan);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:600px){.app{padding:16px}.add-task-form,.ai-plan-actions{flex-direction:column}}
