:root { font-family: ui-sans-serif, system-ui, sans-serif; color-scheme: light dark; }
body { margin: 0; }
header { display: flex; justify-content: space-between; align-items: center;
  padding: 0.5rem 1rem; border-bottom: 1px solid color-mix(in srgb, currentColor 20%, transparent); }
h1 { font-size: 1.1rem; margin: 0; }
main { padding: 1rem; }
table { border-collapse: collapse; width: 100%; }
th, td { text-align: left; padding: 0.4rem 0.6rem;
  border-bottom: 1px solid color-mix(in srgb, currentColor 15%, transparent); }
.badge { padding: 0.1rem 0.5rem; border-radius: 999px; font-size: 0.8rem; }
.badge.queued { background: #64748b33; }
.badge.running { background: #3b82f633; }
.badge.succeeded { background: #22c55e33; }
.badge.failed, .badge.timed_out, .badge.interrupted { background: #ef444433; }
.badge.cancelled { background: #f59e0b33; }
.event { margin: 0.15rem 0; padding: 0.3rem 0.5rem; font-size: 0.8rem;
  overflow-x: auto; background: color-mix(in srgb, currentColor 6%, transparent); }
.event.stderr { border-left: 3px solid #ef4444; }
.event.assistant { border-left: 3px solid #3b82f6; }
dl { display: grid; grid-template-columns: max-content 1fr; gap: 0.3rem 1rem; }
dt { opacity: 0.7; }
dd { margin: 0; overflow-x: auto; }