/* Reusable UI components: stat tiles, data grid, state chips, panels, action cards, agent cards. */
.tiles{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:6px}
.tiles.four{grid-template-columns:repeat(4,1fr)}
@media(max-width:720px){.tiles,.tiles.four{grid-template-columns:repeat(2,1fr)}}
.tile{background:var(--panel);border:1px solid var(--border);border-left-width:3px;border-left-color:var(--border);border-radius:10px;padding:14px 16px}
.tile .n{font-weight:700;font-size:26px;line-height:1;letter-spacing:-.02em}
.tile .k{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);margin-top:6px}
.tile.s-RUNNING{border-left-color:var(--running)} .tile.s-AWAITING_APPROVAL{border-left-color:var(--signal)}
.tile.s-SUCCEEDED{border-left-color:var(--done)} .tile.s-FAILED{border-left-color:var(--failed)} .tile.s-cost{border-left-color:var(--cost)}

table.grid{width:100%;border-collapse:collapse}
.grid th{text-align:left;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);font-weight:500;padding:8px 12px;border-bottom:1px solid var(--border)}
.grid td{padding:10px 12px;border-bottom:1px solid var(--border);font-size:13px}
.grid tr:last-child td{border-bottom:none}
.grid tr:hover td{background:var(--panel2)}
.owner .src{font-family:var(--mono);font-size:10px;margin-left:6px;padding:1px 6px;border-radius:4px;border:1px solid var(--border)}
.owner .src-manual{color:var(--faint)}
.owner .src-triggered{color:var(--signal);border-color:var(--signal)}

.chip{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding:2px 9px;border-radius:3px;border:1px solid;background:transparent}
.chip.s-QUEUED{color:var(--queued);border-color:var(--queued)} .chip.s-RUNNING{color:var(--running);border-color:var(--running)}
.chip.s-AWAITING_APPROVAL{color:#fff;border-color:var(--signal);background:var(--signal)} .chip.s-SUCCEEDED{color:var(--done);border-color:var(--done)}
.chip.s-EXECUTING_ACTION{color:var(--running);border-color:var(--running)}
.chip.s-FAILED,.chip.s-REJECTED,.chip.s-CANCELED{color:var(--failed);border-color:var(--failed)}

.panel{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:16px 18px;margin:0 0 14px}
.two{display:grid;gap:14px} @media(min-width:680px){.two{grid-template-columns:1fr 1fr}}
.rhead{display:flex;align-items:center;gap:14px;margin:2px 0 6px}
.meta{color:var(--dim);font-size:12.5px;margin-bottom:18px} .meta b{color:var(--ink)}
pre{margin:0;font-family:var(--mono);font-size:12px;line-height:1.6;color:var(--dim);background:var(--panel2);border:1px solid var(--border);border-radius:8px;padding:12px;overflow-x:auto}
pre.wrap{white-space:pre-wrap;color:var(--ink)}
ul.find{margin:0;padding-left:18px} ul.find li{margin-bottom:6px}
.logs{max-height:220px;overflow:auto} .log{font-family:var(--mono);font-size:12px;color:var(--dim);padding:3px 0;border-bottom:1px solid var(--border)}

.act{border:1px solid var(--border);border-radius:10px;padding:14px;margin-bottom:12px;background:var(--panel2)}
.act-h{display:flex;gap:10px;align-items:center;margin-bottom:6px}
.act .type{font-family:var(--mono);color:var(--signal);font-size:13px} .act .risk{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.act .tgt{font-family:var(--mono);font-size:12px;color:var(--dim);margin-bottom:8px}
.row{display:flex;gap:10px;margin-top:12px} .row form{margin:0}

/* Single column: agent cards now hold a deployments table, so they need the full width. */
.agents{display:grid;gap:12px}
.agent{display:block;background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:16px 18px;transition:border-color .15s}
/* Keep deployment names, runtime, and trigger tokens on one line instead of hyphen-breaking. */
.agent .grid td{white-space:nowrap}
.agent:hover{border-color:var(--accent)}
.agent-h{display:flex;align-items:center;justify-content:space-between}
.agent .an{font-weight:650;font-size:16px;color:var(--ink)}
.agent .ad{color:var(--dim);font-size:12.5px;margin:8px 0}
.agent .acaps{font-family:var(--mono);font-size:11px;color:var(--accent);word-break:break-word}
.agent .adep{font-family:var(--mono);font-size:10.5px;color:var(--faint);margin-top:8px}
.rt{font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;padding:2px 8px;border-radius:6px;border:1px solid var(--border);color:var(--dim);white-space:nowrap;display:inline-block}
.rt-k8s-job{color:var(--accent);border-color:var(--accent)}
.caps{display:flex;flex-wrap:wrap;gap:6px}
.cap{font-family:var(--mono);font-size:12px;color:var(--ink);background:var(--panel2);border:1px solid var(--border);border-radius:6px;padding:3px 9px}
.cap.opt{color:var(--dim)}

/* deployment / runner status badges */
.badge{font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;padding:2px 8px;border-radius:4px;border:1px solid var(--border);color:var(--dim)}
.badge.b-live{color:var(--done);border-color:var(--done)}
.badge.b-down,.badge.b-stale{color:#fff;background:var(--failed);border-color:var(--failed)}
.badge.b-webhook{color:var(--signal);border-color:var(--signal)}
.badge.b-manual,.badge.b-never{color:var(--faint)}
.mode{font-family:var(--mono);font-size:11px;color:var(--dim)}