* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; background: #111; color: #ddd;
  font: 13px ui-monospace, monospace; }
#bar { display: flex; align-items: center; gap: 4px; height: 34px;
  padding: 0 6px; background: #1a1a1a; border-bottom: 1px solid #333; }
#tabs { display: flex; gap: 2px; overflow-x: auto; flex: 1; }
.tab { display: flex; align-items: center; gap: 6px; padding: 4px 10px;
  background: #222; border: 1px solid #333; border-radius: 6px 6px 0 0;
  cursor: pointer; white-space: nowrap; }
.tab.active { background: #2d2d2d; border-color: #555; }
.tab[data-status="active"]::before { content: "●"; color: #4ad; }
.tab[data-status="idle"]::before { content: "●"; color: #888; }
.tab[data-status="dead"]::before { content: "●"; color: #a33; }
.tab .close { background: none; border: none; color: #888; cursor: pointer; }
#new { background: #2a2a2a; color: #ddd; border: 1px solid #444;
  border-radius: 6px; width: 28px; height: 24px; cursor: pointer; }
#who { color: #777; margin-left: 8px; }
#stage { position: absolute; top: 34px; left: 0; right: 0; bottom: 0; }
.term { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* New-task composer (Claude.ai-style) */
.composer-overlay { position: fixed; inset: 34px 0 0 0; z-index: 50;
  display: flex; align-items: center; justify-content: center;
  background: rgba(8, 8, 8, 0.7); }
.composer-card { width: min(680px, 92vw); display: flex; flex-direction: column;
  align-items: center; gap: 14px; padding: 0 16px; }
.composer-greeting { font-size: 26px; color: #eee; font-weight: 600;
  letter-spacing: 0.3px; }
.composer-box { width: 100%; background: #1b1b1b; border: 1px solid #3a3a3a;
  border-radius: 14px; padding: 12px 14px; display: flex; flex-direction: column;
  gap: 10px; box-shadow: 0 8px 30px rgba(0,0,0,0.45); }
.composer-box:focus-within { border-color: #5a5a5a; }
#nt-desc { width: 100%; resize: vertical; min-height: 64px; background: transparent;
  border: none; outline: none; color: #eee; font: 15px ui-monospace, monospace;
  line-height: 1.5; }
#nt-desc::placeholder { color: #777; }
.composer-row { display: flex; align-items: center; gap: 10px; }
.composer-repo { flex: 1; background: #141414; border: 1px solid #333;
  border-radius: 8px; padding: 7px 10px; color: #ccc; outline: none;
  font: 12px ui-monospace, monospace; }
.composer-repo::placeholder { color: #666; }
.composer-repo:focus { border-color: #555; }
.btn-primary { background: #c96442; color: #fff; border: none; border-radius: 8px;
  padding: 8px 16px; cursor: pointer; font: 13px ui-monospace, monospace;
  font-weight: 600; white-space: nowrap; }
.btn-primary:hover { background: #d6724f; }
.btn-primary:disabled { opacity: 0.6; cursor: default; }
.field-err { color: #e07a5f; font-size: 12px; }
.composer-hint { color: #666; font-size: 11px; }