/* agentwork.js on the Agents page: a card's Now line and newest artifact,
 * and the detail's "Now and recent work" part (Now, Recent tasks,
 * Artifacts side by side, stacked on a phone). Ink tokens only: running
 * reads in weight, a block in --sv-danger, a review in --sv-attention; no
 * green. Light and dark come from the tokens. */

.agentwork-now, .agentwork-latest { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 var(--sv-space-2); min-width: 0; }
.agentwork-now { color: var(--sv-ink-secondary); }
.agentwork-state { font-size: var(--ui-meta); font-weight: 600; color: var(--sv-ink-secondary); }
[data-state="running"] > .agentwork-state { color: var(--sv-ink); }
[data-state="blocked"] > .agentwork-state { color: var(--sv-danger); }
[data-state="review"] > .agentwork-state { color: var(--sv-attention); }
[data-state="idle"] > .agentwork-state { font-weight: 400; color: var(--sv-ink-tertiary); }
.agentwork-latest .agentwork-state { font-weight: 400; color: var(--sv-ink-tertiary); }
.agentwork-title { min-width: 0; color: var(--sv-ink); overflow-wrap: anywhere; }
a.agentwork-title { text-decoration: underline; text-decoration-color: var(--sv-fill-4, currentColor); text-underline-offset: 2px; }
a.agentwork-title:hover { text-decoration-color: currentColor; }
.agentwork-when, .agentwork-where { font-size: var(--ui-meta); color: var(--sv-ink-tertiary); min-width: 0; overflow-wrap: anywhere; }

.agentwork-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr) minmax(0, 1.2fr); gap: var(--sv-space-4); align-items: start; }
.agentwork-col { display: grid; gap: var(--sv-space-1); align-content: start; min-width: 0; }
.agentwork-line { display: grid; gap: 2px; margin: 0; min-width: 0; }
.agentwork-list { display: grid; gap: var(--sv-space-2); margin: 0; padding: 0; list-style: none; min-width: 0; }
.agentwork-task { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); column-gap: var(--sv-space-2); align-items: baseline; min-width: 0; }
.agentwork-task .agentwork-where { grid-column: 2; }
.agentwork-status { font-size: var(--ui-meta); color: var(--sv-ink-secondary); }
.agentwork-task[data-status="running"] .agentwork-status { color: var(--sv-ink); font-weight: 600; }
.agentwork-task[data-status="blocked"] .agentwork-status { color: var(--sv-danger); }
.agentwork-task[data-status="review"] .agentwork-status { color: var(--sv-attention); }
.agentwork-artifact { display: grid; gap: 2px; min-width: 0; }

@media (max-width: 860px) {
  .agentwork-grid { grid-template-columns: minmax(0, 1fr); gap: var(--sv-space-3); }
}