:root{--bg:#0a0f1e;--surface:#111827;--surface-hover:#1f2937;--border:#1e293b;--border-bright:#334155;--text:#f1f5f9;--text-muted:#64748b;--text-dim:#475569;--accent:#f59e0b;--accent-dim:#f59e0b26;--success:#10b981;--success-dim:#10b98126;--warning:#f59e0b;--warning-dim:#f59e0b26;--error:#ef4444;--error-dim:#ef444426;--info:#3b82f6;--info-dim:#3b82f626;--font:"Inter", system-ui, sans-serif;--mono:"JetBrains Mono", "Fira Code", monospace}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{font-size:14px}body{font-family:var(--font);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;min-height:100vh}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--border-bright);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-dim)}.app{max-width:1400px;margin:0 auto;padding:1.5rem 2rem 3rem}.header{border-bottom:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.5rem;padding-bottom:1.25rem;display:flex}.header-left{align-items:center;gap:.75rem;display:flex}.header-logo{color:var(--text);letter-spacing:-.02em;font-size:1.4rem;font-weight:700}.header-logo span{color:var(--accent)}.header-right{align-items:center;gap:.75rem;display:flex}.header-meta{color:var(--text-muted);font-size:.8rem;font-family:var(--mono)}.toolbar{flex-wrap:wrap;align-items:center;gap:.5rem;margin-bottom:1.25rem;display:flex}.filter-tabs{background:var(--surface);border:1px solid var(--border);border-radius:8px;gap:.25rem;padding:3px;display:flex}.filter-tab{color:var(--text-muted);font-family:var(--font);cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:5px;padding:.35rem .85rem;font-size:.8rem;font-weight:500;transition:all .15s}.filter-tab:hover{color:var(--text);background:var(--surface-hover)}.filter-tab.active{background:var(--accent);color:#000;font-weight:600}.search-input{background:var(--surface);border:1px solid var(--border);color:var(--text);font-family:var(--font);border-radius:8px;outline:none;width:180px;padding:.35rem .75rem;font-size:.8rem;transition:border-color .15s}.search-input:focus{border-color:var(--accent)}.search-input::placeholder{color:var(--text-dim)}.refresh-btn{border:1px solid var(--border);background:var(--surface);color:var(--text);font-family:var(--font);cursor:pointer;border-radius:8px;align-items:center;gap:.4rem;padding:.35rem .85rem;font-size:.8rem;font-weight:500;transition:all .15s;display:flex}.refresh-btn:hover{border-color:var(--accent);color:var(--accent)}.refresh-btn.loading svg{animation:1s linear infinite spin}.refresh-btn svg{width:13px;height:13px}.status-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px;display:inline-block}.status-dot.healthy{background:var(--success)}.status-dot.errored{background:var(--error);animation:1.5s ease-in-out infinite pulse-err}.status-dot.stopped{background:var(--warning)}.status-dot.unknown,.status-dot.no-services{background:var(--text-dim)}@keyframes pulse-err{0%,to{opacity:1;box-shadow:0 0 #ef444466}50%{opacity:.7;box-shadow:0 0 0 4px #ef444400}}.project-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem;margin-bottom:2rem;display:grid}.project-card{background:var(--surface);border:1px solid var(--border);cursor:pointer;border-radius:12px;padding:1.1rem 1.25rem;transition:all .15s;animation:.3s ease-out fadeIn}.project-card:hover{border-color:var(--border-bright);background:var(--surface-hover);transform:translateY(-1px)}.project-card-top{justify-content:space-between;align-items:flex-start;gap:.5rem;margin-bottom:.6rem;display:flex}.project-name{color:var(--text);align-items:center;gap:.4rem;font-size:.95rem;font-weight:600;display:flex}.project-emoji{flex-shrink:0;font-size:1.1rem}.project-status-label{white-space:nowrap;border-radius:20px;padding:.2rem .5rem;font-size:.72rem;font-weight:600}.project-status-label.healthy{background:var(--success-dim);color:var(--success)}.project-status-label.errored{background:var(--error-dim);color:var(--error)}.project-status-label.stopped{background:var(--warning-dim);color:var(--warning)}.project-status-label.no-services,.project-status-label.unknown{background:var(--surface-hover);color:var(--text-muted)}.project-desc{color:var(--text-muted);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:.75rem;font-size:.78rem;line-height:1.4;display:-webkit-box;overflow:hidden}.services-mini{flex-wrap:wrap;gap:.35rem;margin-bottom:.75rem;display:flex}.service-badge{background:var(--bg);border:1px solid var(--border);font-size:.72rem;font-family:var(--mono);color:var(--text-muted);border-radius:6px;align-items:center;gap:.3rem;padding:.2rem .5rem;display:flex}.service-badge .dot{border-radius:50%;flex-shrink:0;width:5px;height:5px}.service-badge .dot.online{background:var(--success)}.service-badge .dot.errored{background:var(--error)}.service-badge .dot.stopped{background:var(--warning)}.service-badge .dot.unknown{background:var(--text-dim)}.kanban-mini{color:var(--text-dim);font-size:.72rem;font-family:var(--mono);gap:.5rem;margin-top:.5rem;display:flex}.kanban-mini .kb-item{align-items:center;gap:.2rem;display:flex}.kanban-mini .kb-count{color:var(--text-muted);font-weight:500}.kanban-mini .kb-label{color:var(--text-dim)}.project-git-info{color:var(--text-dim);font-size:.72rem;font-family:var(--mono);white-space:nowrap;text-overflow:ellipsis;margin-top:.5rem;overflow:hidden}.project-path{color:var(--text-dim);font-size:.68rem;font-family:var(--mono);white-space:nowrap;text-overflow:ellipsis;margin-top:.25rem;overflow:hidden}.detail-back{color:var(--text-muted);cursor:pointer;font-size:.82rem;font-family:var(--font);background:0 0;border:none;align-items:center;gap:.4rem;margin-bottom:1.25rem;padding:0;transition:color .15s;display:flex}.detail-back:hover{color:var(--accent)}.detail-back svg{width:14px;height:14px}.detail-header{background:var(--surface);border:1px solid var(--border);border-radius:12px;margin-bottom:1rem;padding:1.25rem 1.5rem}.detail-title-row{flex-wrap:wrap;align-items:center;gap:.75rem;margin-bottom:.5rem;display:flex}.detail-title{font-size:1.3rem;font-weight:700}.detail-title .emoji{font-size:1.4rem}.detail-status-badge{border-radius:20px;padding:.2rem .6rem;font-size:.75rem;font-weight:600}.detail-status-badge.healthy{background:var(--success-dim);color:var(--success)}.detail-status-badge.errored{background:var(--error-dim);color:var(--error)}.detail-status-badge.stopped{background:var(--warning-dim);color:var(--warning)}.detail-status-badge.no-services{background:var(--surface-hover);color:var(--text-muted)}.detail-meta{color:var(--text-muted);font-size:.78rem;font-family:var(--mono);margin-bottom:.35rem}.detail-desc{color:var(--text-muted);margin-top:.6rem;font-size:.85rem;line-height:1.5}.detail-grid{grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:1rem;margin-bottom:2rem;display:grid}.section-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow:hidden}.section-header{border-bottom:1px solid var(--border);color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;align-items:center;gap:.5rem;padding:.75rem 1rem;font-size:.8rem;font-weight:600;display:flex}.section-header svg{width:13px;height:13px;color:var(--accent)}.section-body{padding:.75rem 1rem}.services-table{border-collapse:collapse;width:100%}.services-table th{text-align:left;color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border);padding:0 .5rem .5rem 0;font-size:.72rem;font-weight:600}.services-table td{vertical-align:middle;border-bottom:1px solid #1e293b80;padding:.5rem .5rem .5rem 0;font-size:.8rem}.services-table tr:last-child td{border-bottom:none}.svc-name{font-family:var(--mono);color:var(--text);font-size:.78rem}.svc-status{white-space:nowrap;align-items:center;gap:.35rem;display:flex}.svc-status-label{font-size:.72rem}.svc-status-label.online{color:var(--success)}.svc-status-label.errored{color:var(--error)}.svc-status-label.stopped{color:var(--warning)}.svc-status-label.unknown{color:var(--text-dim)}.svc-uptime{font-family:var(--mono);color:var(--text-muted);white-space:nowrap;font-size:.72rem}.svc-memory{font-family:var(--mono);color:var(--text-dim);font-size:.72rem}.error-line{color:var(--error);font-size:.7rem;font-family:var(--mono);white-space:pre-wrap;word-break:break-all;margin-top:.4rem}.phases-list{flex-direction:column;gap:.5rem;display:flex}.phase-item{align-items:flex-start;gap:.5rem;font-size:.82rem;display:flex}.phase-icon{flex-shrink:0;margin-top:1px;font-size:.9rem}.phase-title{font-weight:500}.phase-title.done{color:var(--success)}.phase-title.pending{color:var(--text-muted)}.phase-items{flex-direction:column;gap:.2rem;margin-top:.25rem;margin-left:1.2rem;display:flex}.phase-item-row{color:var(--text-dim);align-items:center;gap:.35rem;font-size:.76rem;display:flex}.phase-item-row.done{color:var(--success);text-decoration:line-through}.phase-item-row.pending{color:var(--text-muted)}.phase-item-icon{flex-shrink:0;font-size:.8rem}.no-phases{color:var(--text-dim);font-size:.8rem;font-style:italic}.git-row{border-bottom:1px solid #1e293b80;align-items:center;gap:.5rem;padding:.35rem 0;font-size:.8rem;display:flex}.git-row:last-child{border-bottom:none}.git-label{color:var(--text-dim);font-size:.72rem;font-family:var(--mono);min-width:90px}.git-value{font-family:var(--mono);color:var(--text-muted);word-break:break-all;font-size:.78rem}.git-value.highlight{color:var(--accent)}.git-value.danger{color:var(--error)}.git-value.success{color:var(--success)}.links-list{flex-direction:column;gap:.4rem;display:flex}.link-row{align-items:center;gap:.5rem;font-size:.82rem;display:flex}.link-label{color:var(--text-muted);min-width:80px}.link-url{color:var(--info);font-family:var(--mono);font-size:.78rem;text-decoration:none}.link-url:hover{text-decoration:underline}.kanban-summary{gap:1rem;margin-bottom:.75rem;font-size:.8rem;display:flex}.kb-stat{align-items:center;gap:.3rem;display:flex}.kb-stat .label{color:var(--text-dim)}.kb-stat .count{font-weight:600;font-family:var(--mono)}.kb-stat .count.green{color:var(--success)}.kb-stat .count.amber{color:var(--warning)}.kb-stat .count.red{color:var(--error)}.kb-stat .count.muted{color:var(--text-dim)}.ready-tasks{flex-direction:column;gap:.4rem;display:flex}.ready-task{background:var(--bg);border:1px solid var(--border);border-radius:6px;align-items:flex-start;gap:.5rem;padding:.5rem;display:flex}.ready-task-id{font-family:var(--mono);color:var(--text-dim);white-space:nowrap;font-size:.68rem}.ready-task-title{color:var(--text);flex:1;font-size:.78rem}.ready-task-assignee{background:var(--accent-dim);color:var(--accent);font-size:.7rem;font-family:var(--mono);white-space:nowrap;border-radius:4px;padding:.1rem .4rem}.cron-table{border-collapse:collapse;width:100%}.cron-table th{text-align:left;color:var(--text-dim);text-transform:uppercase;border-bottom:1px solid var(--border);padding:0 .5rem .5rem 0;font-size:.72rem;font-weight:600}.cron-table td{vertical-align:middle;border-bottom:1px solid #1e293b80;padding:.4rem .5rem .4rem 0;font-size:.78rem}.cron-table tr:last-child td{border-bottom:none}.cron-name{font-family:var(--mono);color:var(--text)}.cron-status-ok{color:var(--success);font-size:.72rem}.cron-status-err{color:var(--error);font-size:.72rem}.cron-next{font-family:var(--mono);color:var(--text-muted);white-space:nowrap;font-size:.72rem}.cron-enabled{color:var(--text-dim);font-size:.72rem}.loading-state{color:var(--text-muted);flex-direction:column;justify-content:center;align-items:center;gap:1rem;padding:4rem 2rem;display:flex}.loading-spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:32px;height:32px;animation:.8s linear infinite spin}.error-state{background:var(--error-dim);border:1px solid var(--error);color:var(--error);border-radius:10px;padding:1.25rem;font-size:.85rem}.no-projects{color:var(--text-dim);text-align:center;padding:2rem;font-size:.85rem}.footer{border-top:1px solid var(--border);color:var(--text-dim);font-size:.75rem;font-family:var(--mono);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-top:2rem;padding-top:1rem;display:flex}.footer .ts{color:var(--text-muted)}.footer .next{color:var(--accent)}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:.25s ease-out fadeIn}@media (width<=768px){.app{padding:1rem}.detail-grid{grid-template-columns:1fr}.header{flex-direction:column;align-items:flex-start}}