apps/desktop/src/renderer/styles/task-ledger.css

.maka-task-ledger-panel {
  height: 100%;
  min-height: 0;
  overflow-y: auto;
  padding: var(--space-2);
}

.maka-task-ledger-tree {
  display: grid;
  gap: var(--border-width-hairline);
}

.maka-task-ledger-row {
  display: grid;
  grid-template-columns: 14px minmax(34px, auto) minmax(100px, 1fr) auto;
  align-items: center;
  gap: var(--space-2);
  min-height: 30px;
  padding: var(--space-1) var(--space-2) var(--space-1) calc(var(--space-2) + var(--task-depth) * var(--space-5));
  border-radius: var(--radius-control);
  color: var(--foreground-dimmed);
  font-size: var(--font-size-caption);
}

.maka-task-ledger-row:hover { background: color-mix(in srgb, var(--foreground) 5%, transparent); }
.maka-task-ledger-row[data-status="in_progress"] > svg { color: var(--status-running); }
.maka-task-ledger-row[data-status="blocked"] > svg { color: var(--warning); }
.maka-task-ledger-row[data-status="completed"] > svg { color: var(--success); }
.maka-task-ledger-row[data-status="failed"] > svg { color: var(--destructive); }

.maka-task-ledger-key {
  color: var(--foreground-dimmed);
  font-family: var(--font-mono);
  font-size: var(--font-size-caption);
  white-space: nowrap;
}

.maka-task-ledger-subject,
.maka-task-ledger-detail {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.maka-task-ledger-subject { color: var(--foreground); font-size: var(--font-size-base); }
.maka-task-ledger-meta { display: inline-flex; justify-content: flex-end; gap: var(--space-1-5); white-space: nowrap; }
.maka-task-ledger-meta > span + span::before { content: "·"; margin-right: var(--space-1-5); }
.maka-task-ledger-detail { grid-column: 3 / -1; color: var(--foreground-dimmed); font-size: var(--font-size-caption); }

.maka-task-ledger-terminal {
  margin-top: var(--space-1);
  border-top: var(--border-width-hairline) solid color-mix(in srgb, var(--border) 60%, transparent);
}

.maka-task-ledger-terminal-trigger {
  min-height: 30px;
  justify-content: space-between;
  padding: var(--space-1) var(--space-2);
  color: var(--foreground-dimmed);
  font-size: var(--font-size-caption);
}

.maka-task-ledger-terminal-trigger > span { display: inline-flex; align-items: center; gap: var(--space-1-5); }
.maka-task-ledger-terminal-trigger svg { transition: transform var(--duration-base) var(--ease-out-strong); }
.maka-task-ledger-terminal-trigger svg[data-open="true"] { transform: rotate(180deg); }

.maka-task-ledger-message {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 34px;
  padding: var(--space-1) var(--space-2);
  color: var(--foreground-dimmed);
  font-size: var(--font-size-caption);
}

.maka-task-ledger-retry {
  display: inline-grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border: 0;
  border-radius: var(--radius-control);
  background: transparent;
  color: inherit;
}

.maka-task-ledger-retry:hover { background: color-mix(in srgb, var(--foreground) 7%, transparent); }

@media (max-width: 620px) {
  .maka-task-ledger-row { grid-template-columns: 14px minmax(32px, auto) minmax(0, 1fr); }
  .maka-task-ledger-meta { grid-column: 3; justify-content: flex-start; }
  .maka-task-ledger-detail { grid-column: 3; white-space: normal; overflow-wrap: anywhere; }
}

@media (prefers-reduced-motion: reduce) {
  .maka-task-ledger-terminal-trigger svg { transition: none; }
}