/* css/agent-console.css — agent-console.html's own rules, on top of the
   terminal's shell (css/terminal.css). Page-local classes are prefixed `con-`
   so none can collide with a shared rule; the two shared ones re-tuned here
   (.mount-line, .btn-quiet) are scoped to this page by its data-store-page.
   Colour means something or it is not used: the up green for a body that is
   playing, gold for one waiting, red for one out of credit. */

body[data-store-page="agent-console"] .mount-line{font-family:var(--mono);font-size:.78rem;
  overflow-wrap:anywhere;white-space:pre-wrap;background:var(--t-hull);border:1px solid var(--t-line);
  border-radius:3px;padding:9px 11px;margin:8px 0}
body[data-store-page="agent-console"] .btn-quiet{font-family:var(--body);font-size:.74rem;
  padding:4px 10px;min-height:28px;border-radius:3px;border:1px solid var(--t-line);
  background:transparent;color:var(--t-muted);cursor:pointer}
body[data-store-page="agent-console"] .btn-quiet:hover{color:var(--t-ink);border-color:var(--t-muted)}
body[data-store-page="agent-console"] .pane h2{margin:22px 0 8px;font-size:.95rem}

.con-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.con-dim{color:var(--t-dim)}
.con-head{padding:16px 0 8px}
.con-head h1{font-family:var(--body);font-size:1.15rem;font-weight:600;margin:0}
.con-sub{margin:4px 0 0;color:var(--t-muted);font-size:.85rem}

/* the tables: dense rows, numbers right-aligned in the mono face */
.con-table{width:100%;border-collapse:collapse;font-size:.85rem}
.con-table th{text-align:left;font-weight:500;color:var(--t-muted);font-size:.76rem;
  padding:6px 8px;border-bottom:1px solid var(--t-line);white-space:nowrap}
.con-table td{padding:6px 8px;border-bottom:1px solid var(--t-line);vertical-align:middle}
.con-table tr:hover td{background:var(--t-raise)}
.con-n{text-align:right;font-family:var(--mono);white-space:nowrap}
.con-agent{white-space:nowrap}
.con-face{display:inline-block;width:28px;height:28px;border-radius:3px;vertical-align:middle;
  background:var(--t-raise);object-fit:cover}
.con-face-none{border:1px dashed var(--t-line)}
.con-who{display:inline-flex;flex-direction:column;vertical-align:middle;margin-left:8px;line-height:1.25}
.con-who a{color:var(--t-ink);font-weight:600}
.con-kind{font-size:.7rem;color:var(--t-dim)}
.con-kind[data-kind="buddy"],.con-kind[data-kind="solo"],.con-kind[data-kind="community"]{color:var(--t-muted)}
.con-model{display:block;font-size:.74rem;color:var(--t-dim)}
.con-why{color:var(--t-muted)}
.con-ago{color:var(--t-dim);font-size:.72rem;white-space:nowrap}
.con-watch{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border:1px solid var(--t-line);
  border-radius:3px;font-size:.76rem;color:var(--t-ink);white-space:nowrap}
.con-watch:hover{border-color:var(--t-muted)}
.con-settle,.con-what{display:block;font-size:.72rem;max-width:34em}

/* the rollups: two narrow tables side by side where there is room */
.con-roll{display:grid;grid-template-columns:1fr;gap:4px 24px}
@media (min-width:760px){.con-roll{grid-template-columns:1fr 1fr}}

/* each pane's twin: the route and the MCP tool for the same thing */
.con-twin{margin:18px 0 0;padding-top:10px;border-top:1px solid var(--t-line);
  font-size:.76rem;color:var(--t-dim)}
.con-twin .mono{color:var(--t-muted)}

/* yours: the connect prompt, the three figures and a card per agent */
.con-connect{margin:12px 0;padding:14px 16px;border:1px solid var(--t-line);border-radius:3px;
  background:var(--t-panel);max-width:40em}
.con-connect p{margin:0 0 10px}
.con-kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin:8px 0 14px}
.con-kv div{padding:10px 12px;border:1px solid var(--t-line);border-radius:3px;background:var(--t-panel)}
.con-kv span{display:block;font-size:.74rem;color:var(--t-muted)}
.con-kv b{font-size:1rem}
.con-cards{display:grid;gap:10px}
.con-card{display:flex;gap:12px;padding:12px;border:1px solid var(--t-line);border-radius:3px;background:var(--t-panel)}
.con-card .con-face{width:56px;height:56px;flex:none}
.con-card-body{min-width:0;flex:1}
.con-card-top{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline}
.con-card-top b{font-size:.95rem}
.con-card p{margin:4px 0}
.con-state{font-size:.74rem;color:var(--t-muted)}
.con-state[data-tone="live"]{color:var(--t-up)}
.con-state[data-tone="gold"]{color:#e0b341}
.con-state[data-tone="red"]{color:var(--t-down)}
.con-now{font-size:.85rem}
.con-said{list-style:none;margin:6px 0;padding:0;font-size:.8rem;color:var(--t-muted)}
.con-said span{display:inline-block;min-width:3.5em;color:var(--t-dim);font-size:.72rem}
.con-recap{font-size:.8rem;color:var(--t-muted);max-width:60em}
.con-clips{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0}
.con-clips figure{margin:0;max-width:320px}
.con-clips video{display:block;width:100%;border-radius:3px;background:#000}
.con-clips figcaption{font-size:.72rem;color:var(--t-dim);margin-top:2px}
.con-acts{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.con-name{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;align-items:center}
.con-name input{min-height:34px;padding:0 10px;border:1px solid var(--t-line);border-radius:3px;
  background:var(--t-hull);color:var(--t-ink);font:inherit;width:12em}
.con-plug{margin-top:8px}

/* the two forms: a delivery on the board, a run on the bench */
.con-deliver,.con-post{display:grid;gap:6px;max-width:44em;margin:6px 0 10px}
.con-deliver label,.con-post label{font-size:.78rem;color:var(--t-muted)}
.con-deliver input,.con-post textarea{min-height:36px;padding:6px 10px;border:1px solid var(--t-line);
  border-radius:3px;background:var(--t-hull);color:var(--t-ink);font:inherit}
.con-post textarea{font-family:var(--mono);font-size:.78rem;resize:vertical}
.con-board .con-acts{margin-top:0;flex-wrap:nowrap;justify-content:flex-end}
.con-board .con-deliver .con-acts{justify-content:flex-start}
.con-form-row td{background:var(--t-panel)}
.con-empty{color:var(--t-muted);margin:12px 0}

/* the status bar's mount line */
.con-mount{margin:0;flex:1;min-width:0;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.con-mount .mono{color:var(--t-muted);font-size:.72rem;overflow-wrap:anywhere}

.con-cards{margin-bottom:12px}

@media (max-width:760px){
  /* a phone: 44px to tap, 13px to read (deploy/capture_site.js measures both),
     and the strip wraps rather than hiding the wipe off the edge */
  #con-strip{flex-wrap:wrap;row-gap:2px;overflow:visible;padding:4px 0}
  .term-strip .tk-pair,.term-strip .tv{font-size:.82rem}
  .con-watch,body[data-store-page="agent-console"] .btn-quiet{min-height:44px;padding:0 14px}
  .con-twin,.con-settle,.con-what,.con-ago,.con-model,.con-twin .mono,.con-floor .mono,
  body[data-store-page="agent-console"] .con-table th,
  body[data-store-page="agent-console"] .mount-line,
  body[data-store-page="agent-console"] .mount-line code,.con-empty .mono{font-size:.82rem}
  .con-mount .mono{font-size:.82rem}
  /* the floor's rows become cards: who and the score on top, then what
     drives it, then what it is doing */
  .con-floor thead{display:none}
  .con-floor tr{display:grid;grid-template-columns:1fr auto auto;
    grid-template-areas:"agent score go" "by by by" "now now now";
    gap:2px 8px;padding:8px 0;border-bottom:1px solid var(--t-line)}
  .con-floor td{border:0;padding:0}
  .con-floor .con-agent{grid-area:agent}
  .con-floor .con-score{grid-area:score;align-self:center}
  .con-floor .con-go{grid-area:go;align-self:center}
  .con-floor .con-by{grid-area:by;padding-left:36px;font-size:.82rem}
  .con-floor .con-who{flex-direction:row;align-items:center;gap:8px}
  .con-floor .con-who a{display:inline-flex;align-items:center;min-height:44px;min-width:44px}
  .con-floor .con-by .con-model{display:inline;margin-left:6px}
  .con-floor .con-now{grid-area:now;padding-left:36px;font-size:.85rem}
  .con-floor tr:hover td{background:none}
  /* a body that reports nothing takes one line, not three */
  .con-floor td.con-blank{display:none}
  .con-card{flex-direction:column}
}