:root {
  --bg: #0a0e17; --bg2: #111827; --bg3: #1f2937; --bg4: #374151;
  --text: #e5e7eb; --muted: #9ca3af; --accent: #3b82f6; --accent2: #8b5cf6;
  --green: #22c55e; --red: #ef4444; --yellow: #eab308; --orange: #f97316;
  --radius: 12px; --shadow: 0 4px 20px rgba(0,0,0,.4);
}
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family: 'Segoe UI', system-ui, -apple-system, sans-serif; background: var(--bg); color: var(--text); display:flex; min-height:100vh; }
a { color: var(--accent); }

/* Sidebar */
#sidebar { width:220px; background:var(--bg2); border-right:1px solid var(--bg3); display:flex; flex-direction:column; position:fixed; top:0; left:0; bottom:0; z-index:100; }
.logo { padding:20px; font-size:1.3em; font-weight:700; border-bottom:1px solid var(--bg3); }
#sidebar ul { list-style:none; flex:1; padding:8px; }
#sidebar li { padding:10px 14px; border-radius:8px; cursor:pointer; transition:.15s; font-size:.95em; margin-bottom:2px; }
#sidebar li:hover { background:var(--bg3); }
#sidebar li.active { background:var(--accent); color:white; font-weight:600; }
.sidebar-footer { padding:12px 16px; border-top:1px solid var(--bg3); font-size:.85em; color:var(--muted); }
.ws-dot { font-size:1.2em; }
.ws-dot.online { color:var(--green); }
.ws-dot.offline { color:var(--red); }

/* Main */
main { margin-left:220px; flex:1; padding:24px; max-width:1200px; }
.page { display:none; animation:fadeIn .3s; }
.page.active { display:block; }
@keyframes fadeIn { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
h1 { margin-bottom:20px; font-size:1.6em; }

/* Stat Grid */
.stat-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(160px, 1fr)); gap:12px; margin-bottom:20px; }
.stat-box { background:var(--bg2); border:1px solid var(--bg3); border-radius:var(--radius); padding:16px; text-align:center; }
.stat-box .value { font-size:1.6em; font-weight:700; color:var(--accent); }
.stat-box .label { font-size:.8em; color:var(--muted); margin-top:4px; }

/* Cards */
.card { background:var(--bg2); border:1px solid var(--bg3); border-radius:var(--radius); padding:16px; margin-bottom:16px; }
.card h3 { margin-bottom:12px; font-size:1.05em; }
.row { display:flex; gap:16px; flex-wrap:wrap; }
.half { flex:1; min-width:300px; }
.third { flex:0 0 280px; min-width:240px; }
.twothird { flex:1; min-width:400px; }

/* Card List */
.card-list .item { background:var(--bg2); border:1px solid var(--bg3); border-radius:var(--radius); padding:14px 16px; margin-bottom:8px; display:flex; align-items:center; gap:12px; transition:.15s; }
.card-list .item:hover { border-color:var(--accent); background:var(--bg3); }
.item .status-dot { width:12px; height:12px; border-radius:50%; flex-shrink:0; }
.item .status-dot.up { background:var(--green); box-shadow:0 0 8px var(--green); }
.item .status-dot.down { background:var(--red); box-shadow:0 0 8px var(--red); }
.item .info { flex:1; }
.item .info .name { font-weight:600; }
.item .info .detail { font-size:.82em; color:var(--muted); margin-top:2px; }
.item .actions { display:flex; gap:6px; }
.item .actions button { background:var(--bg4); border:none; color:var(--text); padding:6px 12px; border-radius:6px; cursor:pointer; font-size:.82em; transition:.15s; }
.item .actions button:hover { background:var(--accent); }
.item .actions button.danger:hover { background:var(--red); }

/* Badges */
.badge { display:inline-block; padding:2px 8px; border-radius:4px; font-size:.75em; font-weight:600; }
.badge.up { background:rgba(34,197,94,.15); color:var(--green); }
.badge.down { background:rgba(239,68,68,.15); color:var(--red); }
.badge.warn { background:rgba(234,179,8,.15); color:var(--yellow); }
.badge.info { background:rgba(59,130,246,.15); color:var(--accent); }
.badge.high { background:rgba(239,68,68,.15); color:var(--red); }
.badge.medium { background:rgba(234,179,8,.15); color:var(--yellow); }
.badge.low { background:rgba(34,197,94,.15); color:var(--green); }

/* Filters */
.filters { margin-bottom:12px; }
.filters input { background:var(--bg2); border:1px solid var(--bg3); color:var(--text); padding:8px 14px; border-radius:8px; width:100%; max-width:400px; font-size:.95em; }
.filters input:focus { outline:none; border-color:var(--accent); }

/* Todos */
.todo-add { display:flex; gap:8px; margin-bottom:16px; }
.todo-add input { flex:1; background:var(--bg2); border:1px solid var(--bg3); color:var(--text); padding:10px 14px; border-radius:8px; font-size:.95em; }
.todo-add input:focus { outline:none; border-color:var(--accent); }
.todo-add select { background:var(--bg2); border:1px solid var(--bg3); color:var(--text); padding:8px; border-radius:8px; }
.todo-add button { background:var(--accent); color:white; border:none; padding:10px 16px; border-radius:8px; cursor:pointer; font-size:1em; }
.todo-item { display:flex; align-items:center; gap:12px; padding:12px 16px; background:var(--bg2); border:1px solid var(--bg3); border-radius:var(--radius); margin-bottom:6px; }
.todo-item.done .todo-text { text-decoration:line-through; color:var(--muted); }
.todo-item input[type=checkbox] { width:18px; height:18px; cursor:pointer; accent-color:var(--accent); }
.todo-text { flex:1; }
.todo-item .delete-btn { background:none; border:none; color:var(--muted); cursor:pointer; font-size:1.1em; padding:4px 8px; border-radius:4px; }
.todo-item .delete-btn:hover { color:var(--red); background:rgba(239,68,68,.1); }

/* Org Chart */
.org-container { overflow-x:auto; padding:20px 0; }
.org-node { display:inline-flex; flex-direction:column; align-items:center; padding:0 16px; vertical-align:top; }
.org-card { background:var(--bg2); border:1px solid var(--bg3); border-radius:var(--radius); padding:14px 18px; text-align:center; min-width:140px; transition:.2s; cursor:default; }
.org-card:hover { border-color:var(--accent); transform:translateY(-2px); box-shadow:var(--shadow); }
.org-card .emoji { font-size:2em; }
.org-card .org-name { font-weight:700; margin-top:4px; }
.org-card .org-role { font-size:.8em; color:var(--accent); }
.org-card .org-model { font-size:.72em; color:var(--muted); margin-top:2px; }
.org-card .org-desc { font-size:.78em; color:var(--muted); margin-top:4px; }
.org-children { display:flex; gap:4px; margin-top:16px; position:relative; }
.org-children::before { content:''; position:absolute; top:-8px; left:50%; width:1px; height:8px; background:var(--bg4); }
.org-connector { display:flex; justify-content:center; height:16px; }
.org-connector::after { content:''; width:1px; height:16px; background:var(--bg4); }

/* Memory Viewer */
#memory-list ul, #overnight-list ul { list-style:none; }
#memory-list li, #overnight-list li { padding:8px 12px; border-radius:6px; cursor:pointer; transition:.15s; font-size:.9em; display:flex; align-items:center; gap:8px; }
#memory-list li:hover, #overnight-list li:hover { background:var(--bg3); }
#memory-list li.active, #overnight-list li.active { background:var(--accent); color:white; }
#memory-viewer .md-content, #overnight-viewer .md-content { max-height:70vh; overflow-y:auto; line-height:1.7; }
#memory-viewer .md-content h1, #memory-viewer .md-content h2, #memory-viewer .md-content h3 { color:var(--accent); margin:16px 0 8px; }
#memory-viewer .md-content code { background:var(--bg3); padding:2px 6px; border-radius:4px; font-size:.9em; }
#memory-viewer .md-content pre { background:var(--bg3); padding:12px; border-radius:8px; overflow-x:auto; }
#overnight-viewer .md-content h1, #overnight-viewer .md-content h2, #overnight-viewer .md-content h3 { color:var(--accent); margin:16px 0 8px; }
#overnight-viewer .md-content code { background:var(--bg3); padding:2px 6px; border-radius:4px; }
#overnight-viewer .md-content pre { background:var(--bg3); padding:12px; border-radius:8px; overflow-x:auto; }

/* Tools */
.tool-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); gap:12px; margin-bottom:20px; }
.tool-card { background:var(--bg2); border:1px solid var(--bg3); border-radius:var(--radius); padding:20px; text-align:center; cursor:pointer; transition:.2s; }
.tool-card:hover { border-color:var(--accent); transform:translateY(-2px); box-shadow:var(--shadow); }
.tool-icon { font-size:2.5em; }
.tool-card h3 { margin:8px 0 4px; }
.tool-card p { font-size:.85em; color:var(--muted); }
.tool-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
.tool-header button { background:none; border:none; color:var(--muted); font-size:1.3em; cursor:pointer; }
#tool-result { background:var(--bg); border-radius:8px; padding:12px; max-height:60vh; overflow:auto; white-space:pre-wrap; font-size:.82em; line-height:1.5; color:var(--green); }

/* Modal */
.modal { display:none; position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:200; align-items:center; justify-content:center; }
.modal.show { display:flex; }
.modal-content { background:var(--bg2); border:1px solid var(--bg3); border-radius:var(--radius); padding:20px; max-width:600px; width:90%; max-height:80vh; overflow-y:auto; }
.modal-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; }
.modal-header button { background:none; border:none; color:var(--muted); font-size:1.3em; cursor:pointer; }

/* Toast */
#toast-container { position:fixed; bottom:20px; right:20px; z-index:300; display:flex; flex-direction:column; gap:8px; }
.toast { background:var(--bg2); border:1px solid var(--bg3); border-radius:8px; padding:12px 16px; box-shadow:var(--shadow); animation:slideIn .3s; max-width:360px; }
.toast.success { border-color:var(--green); }
.toast.error { border-color:var(--red); }
@keyframes slideIn { from { opacity:0; transform:translateX(50px); } }

.muted { color:var(--muted); font-style:italic; }

/* Loading */
.spinner { display:inline-block; width:20px; height:20px; border:2px solid var(--bg4); border-top-color:var(--accent); border-radius:50%; animation:spin .6s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }

/* Responsive */
@media (max-width:768px) {
  #sidebar { width:60px; }
  #sidebar .logo { font-size:1em; padding:12px; text-align:center; }
  #sidebar li { padding:10px; text-align:center; font-size:1.1em; }
  #sidebar li::after { content:''; }
  .sidebar-footer { display:none; }
  main { margin-left:60px; padding:16px; }
  .row { flex-direction:column; }
  .third, .twothird { flex:1; min-width:auto; }
}

/* ==================== ORG CHART v2 ==================== */
.org-toolbar { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; margin-bottom:20px; padding:12px 16px; background:var(--bg2); border:1px solid var(--bg3); border-radius:var(--radius); }
.org-stats { display:flex; gap:8px; flex-wrap:wrap; }
.org-actions { display:flex; gap:8px; }
.org-tree-scroll { overflow-x:auto; padding:20px 0; }

.org-node { display:inline-flex; flex-direction:column; align-items:center; padding:0 8px; vertical-align:top; }
.org-card { background:var(--bg2); border:2px solid var(--bg3); border-radius:var(--radius); padding:14px 16px; text-align:center; min-width:150px; max-width:200px; transition:.2s; cursor:pointer; position:relative; }
.org-card:hover { border-color:var(--accent); transform:translateY(-2px); box-shadow:var(--shadow); }
.org-card.selected { border-color:var(--accent2); box-shadow:0 0 15px rgba(139,92,246,.3); }

/* Type-specific borders */
.org-card.type-human { border-color:var(--accent); }
.org-card.type-agent { border-color:var(--accent2); }
.org-card.type-app { border-color:var(--green); }
.org-card.type-tool { border-color:var(--orange); }
.org-card.type-workflow { border-color:var(--yellow); }
.org-card.type-division { border-color:var(--accent); border-style:dashed; }

.org-card-header { display:flex; justify-content:center; align-items:center; gap:8px; position:relative; }
.org-emoji { font-size:2em; }
.org-status { width:10px; height:10px; border-radius:50%; position:absolute; top:0; right:-4px; }
.org-name { font-weight:700; margin-top:6px; font-size:.95em; }
.org-role { font-size:.8em; color:var(--accent); margin-top:2px; }
.org-model { font-size:.72em; color:var(--muted); margin-top:2px; font-family:monospace; }
.org-desc { font-size:.78em; color:var(--muted); margin-top:4px; line-height:1.3; }
.org-url { font-size:.72em; color:var(--green); display:block; margin-top:4px; text-decoration:none; }
.org-url:hover { text-decoration:underline; }

.org-card-actions { display:none; position:absolute; bottom:-12px; left:50%; transform:translateX(-50%); background:var(--bg2); border:1px solid var(--bg3); border-radius:8px; padding:2px 4px; gap:2px; z-index:10; white-space:nowrap; }
.org-card:hover .org-card-actions { display:flex; }
.org-card-actions button { background:none; border:none; cursor:pointer; font-size:.85em; padding:4px 6px; border-radius:4px; transition:.1s; }
.org-card-actions button:hover { background:var(--bg4); }
.org-card-actions button.danger:hover { background:rgba(239,68,68,.2); }

.org-children { display:flex; gap:4px; margin-top:20px; justify-content:center; }
.org-connector { display:flex; justify-content:center; height:20px; }
.org-connector::after { content:''; width:2px; height:20px; background:var(--bg4); }
.org-children-inner { display:flex; gap:4px; }
.org-children-inner.hidden { display:none; }
.expand-btn { background:var(--bg3); border:1px solid var(--bg4); color:var(--muted); padding:8px 16px; border-radius:8px; cursor:pointer; font-size:.85em; margin:0 auto; display:block; }
.expand-btn:hover { background:var(--bg4); color:var(--text); }

/* Depth-based scaling */
.depth-3 .org-card, .depth-4 .org-card { min-width:120px; max-width:160px; padding:10px 12px; }
.depth-3 .org-emoji, .depth-4 .org-emoji { font-size:1.5em; }
.depth-3 .org-name, .depth-4 .org-name { font-size:.85em; }

/* ==================== FORMS ==================== */
.form-grid { display:grid; grid-template-columns:100px 1fr; gap:10px; align-items:center; }
.form-grid label { font-size:.9em; color:var(--muted); text-align:right; }
.form-grid input, .form-grid select, .form-grid textarea { background:var(--bg); border:1px solid var(--bg3); color:var(--text); padding:8px 12px; border-radius:6px; font-size:.9em; width:100%; }
.form-grid input:focus, .form-grid select:focus, .form-grid textarea:focus { outline:none; border-color:var(--accent); }
.form-grid textarea { resize:vertical; }

/* ==================== BUTTONS ==================== */
.btn { background:var(--bg3); color:var(--text); border:1px solid var(--bg4); padding:8px 16px; border-radius:8px; cursor:pointer; font-size:.9em; transition:.15s; }
.btn:hover { background:var(--bg4); }
.btn-primary { background:var(--accent); border-color:var(--accent); color:white; }
.btn-primary:hover { filter:brightness(1.15); }
.btn-accent { background:var(--accent2); border-color:var(--accent2); color:white; }
.btn-accent:hover { filter:brightness(1.15); }

/* ==================== ANALYSIS ==================== */
.btn-analyze { background:linear-gradient(135deg, #8b5cf6, #3b82f6); border:none; color:white; }
.btn-analyze:hover { filter:brightness(1.15); }

.org-score { position:absolute; top:-8px; right:-8px; font-size:.7em; font-weight:700; padding:2px 6px; border-radius:10px; }
.org-score.score-good { background:rgba(34,197,94,.2); color:var(--green); }
.org-score.score-warn { background:rgba(234,179,8,.2); color:var(--yellow); }
.org-score.score-bad { background:rgba(239,68,68,.2); color:var(--red); }

.org-card.score-good { border-left:3px solid var(--green); }
.org-card.score-warn { border-left:3px solid var(--yellow); }
.org-card.score-bad { border-left:3px solid var(--red); }

.org-card.analyzing { animation:pulse 1.5s ease-in-out infinite; }
@keyframes pulse { 0%,100% { box-shadow:0 0 0 0 rgba(139,92,246,.4); } 50% { box-shadow:0 0 20px 5px rgba(139,92,246,.2); } }

.analysis-date { font-size:.68em; color:var(--muted); margin-top:4px; }

.task-badges { display:flex; gap:4px; justify-content:center; margin-top:6px; flex-wrap:wrap; }
.tbadge { font-size:.65em; padding:1px 6px; border-radius:4px; font-weight:600; }
.tbadge.dev { background:rgba(59,130,246,.15); color:var(--accent); }
.tbadge.qa { background:rgba(234,179,8,.15); color:var(--yellow); }
.tbadge.ops { background:rgba(34,197,94,.15); color:var(--green); }

.agent-tasks-mini { font-size:.72em; color:var(--accent); cursor:pointer; margin-top:4px; padding:2px 6px; border-radius:4px; background:rgba(59,130,246,.1); }
.agent-tasks-mini:hover { background:rgba(59,130,246,.2); }

.org-card-actions button.analyze { color:var(--accent2); }

/* Analysis Modal */
.analysis-header { display:flex; gap:20px; align-items:center; margin-bottom:20px; padding-bottom:16px; border-bottom:1px solid var(--bg3); }
.score-circle { width:80px; height:80px; border-radius:50%; border:3px solid var(--score-color); display:flex; flex-direction:column; align-items:center; justify-content:center; flex-shrink:0; }
.score-value { font-size:1.4em; font-weight:700; color:var(--score-color); }
.score-label { font-size:.7em; color:var(--muted); }
.analysis-meta { font-size:.85em; line-height:1.8; }
.analysis-meta div { color:var(--muted); }

.findings-section h3 { margin:16px 0 8px; padding-top:12px; border-top:1px solid var(--bg3); font-size:.95em; }
.findings-section h3:first-child { border-top:none; padding-top:0; }

.task-list { display:flex; flex-direction:column; gap:4px; }
.task-item { display:flex; align-items:center; gap:8px; padding:8px 10px; background:var(--bg); border-radius:6px; font-size:.85em; }
.task-item.done .task-text { text-decoration:line-through; color:var(--muted); }
.task-item.wontfix .task-text { text-decoration:line-through; color:var(--muted); opacity:.6; }
.task-item.working { border-left:2px solid var(--accent); }
.task-item input[type=checkbox] { width:16px; height:16px; accent-color:var(--accent); cursor:pointer; flex-shrink:0; }
.task-text { flex:1; line-height:1.3; }
.task-status { background:var(--bg3); border:1px solid var(--bg4); color:var(--text); padding:2px 6px; border-radius:4px; font-size:.82em; cursor:pointer; }
.task-status:focus { outline:none; border-color:var(--accent); }

/* Agent Controls */
.btn-agent { background:linear-gradient(135deg, #8b5cf6, #3b82f6); color:white; border:none; padding:3px 10px; border-radius:5px; cursor:pointer; font-size:.78em; white-space:nowrap; transition:.15s; }
.btn-agent:hover { filter:brightness(1.2); transform:scale(1.05); }
.org-card-actions button.agent-start { color:var(--accent2); }
.task-item.running, .task-item.working { border-left:3px solid var(--accent2); background:rgba(139,92,246,.05); }

/* Task Results */
.task-result { font-size:.78em; margin-top:4px; padding:4px 8px; border-radius:4px; line-height:1.4; }
.task-result.success { background:rgba(34,197,94,.08); color:var(--green); }
.task-result.error { background:rgba(239,68,68,.08); color:var(--red); }

/* Release Readiness */
.release-section { margin-bottom:20px; padding:16px; background:var(--bg); border-radius:var(--radius); }
.release-badge { display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.release-icon { font-size:1.5em; }
.release-decision { font-weight:700; font-size:1.1em; }
.release-badge.go .release-decision { color:var(--green); }
.release-badge.conditional-go .release-decision { color:var(--yellow); }
.release-badge.no-go .release-decision { color:var(--red); }
.release-score { font-size:1.3em; font-weight:700; color:var(--accent); }
.release-text { font-size:.85em; color:var(--muted); margin-bottom:12px; }
.category-scores { display:flex; flex-direction:column; gap:6px; }
.cat-score-row { display:flex; align-items:center; gap:8px; font-size:.82em; }
.cat-name { width:120px; color:var(--muted); text-align:right; flex-shrink:0; }
.cat-bar { flex:1; height:8px; background:var(--bg3); border-radius:4px; overflow:hidden; min-width:100px; }
.cat-bar-fill { height:100%; border-radius:4px; transition:.3s; }
.cat-value { width:45px; font-weight:600; text-align:right; }
.cat-weight { width:35px; color:var(--muted); font-size:.8em; }
