.agents-page{display:grid;gap:20px}.agent-metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.agent-metric{min-width:0;padding:16px;border:1px solid var(--border);border-radius:18px;background:var(--panel)}.agent-metric small,.agent-metric span{display:block;color:var(--muted)}.agent-metric strong{display:block;margin:6px 0 4px;font-size:28px;line-height:1}.agent-metric.live{box-shadow:inset 0 2px 0 rgba(38,177,125,.55)}.agent-metric.warn{box-shadow:inset 0 2px 0 rgba(215,154,47,.65)}
.agent-controls{display:flex;flex-wrap:wrap;gap:10px;padding:0 20px 18px}.agent-controls label{display:grid;gap:5px;color:var(--muted);font-size:12px}.agent-controls select{min-width:150px}.agent-run-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:0 20px 20px}.agent-run-grid.compact .agent-run-card{min-height:0}.agent-run-card{display:grid;gap:12px;min-width:0;padding:17px;border:1px solid var(--border);border-radius:18px;background:var(--panel-2,var(--panel))}.agent-run-top,.agent-run-footer{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.agent-run-kicker{text-transform:uppercase;letter-spacing:.08em;font-size:11px;color:var(--muted)}.agent-run-card h3{margin:4px 0 0;font-size:16px;line-height:1.35}.agent-run-meta{display:flex;flex-wrap:wrap;gap:8px 14px;color:var(--muted);font-size:12px}.agent-run-meta b{color:var(--text);font-weight:600}.agent-current-action{margin:0;color:var(--muted);overflow-wrap:anywhere}.agent-resource-tags{display:flex;flex-wrap:wrap;gap:6px}.agent-resource-tags span{padding:5px 8px;border-radius:999px;background:var(--surface,#f2f4f4);font:11px ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere}.agent-run-footer{align-items:center;color:var(--muted);font-size:12px}
.agent-approval-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;border-top:1px solid var(--border)}.agent-approval-row p{margin:4px 0 0;color:var(--muted)}.agent-lease-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:0 20px 20px}.agent-lease-grid article{display:grid;gap:4px;padding:13px;border:1px solid var(--border);border-radius:14px}.agent-lease-grid span,.agent-lease-grid small{color:var(--muted);overflow-wrap:anywhere}
.agent-detail{display:grid;gap:18px}.agent-detail-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.agent-detail-hero h2{margin:4px 0 7px}.agent-detail-hero p{margin:0;color:var(--muted)}.agent-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.agent-detail-grid>div{padding:12px;border:1px solid var(--border);border-radius:14px}.agent-detail-grid small,.agent-detail-grid strong{display:block}.agent-detail-grid small{color:var(--muted);margin-bottom:4px}.agent-detail-section{padding-top:14px;border-top:1px solid var(--border)}.agent-detail-section summary{cursor:pointer;font-weight:700}.agent-json-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.agent-detail pre,.agent-event pre{max-height:320px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;padding:12px;border-radius:12px;background:var(--surface,#f2f4f4);font-size:11px}.agent-detail-row,.agent-event{display:grid;gap:4px;padding:10px 0;border-bottom:1px solid var(--border)}.agent-detail-row span,.agent-detail-row small,.agent-event small{color:var(--muted)}.pill.active{background:rgba(42,114,189,.12);color:#2a72bd}
@media(max-width:1100px){.agent-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.agent-lease-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:760px){.agent-metrics,.agent-run-grid,.agent-lease-grid,.agent-detail-grid,.agent-json-grid{grid-template-columns:1fr}.agent-run-grid{padding:0 14px 14px}.agent-controls{padding:0 14px 14px}.agent-controls label,.agent-controls select{width:100%}.agent-approval-row,.agent-run-top,.agent-run-footer,.agent-detail-hero{align-items:stretch;flex-direction:column}.agent-approval-row .actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.agent-approval-row .btn,.agent-run-footer .btn{width:100%}}