:root {
  --paper: #eef1ef;
  --panel: #f8faf9;
  --ink: #12202b;
  --steel: #55666f;
  --steel-soft: #7c8b92;
  --line: #c7d0cd;
  --line-strong: #a9b6b2;
  --accent: #e85d1f;
  --accent-ink: #ffffff;
  --good: #1f8a5f;
  --good-bg: #dcf0e6;
  --warn: #b4791a;
  --warn-bg: #f6e8cf;
  --critical: #c23b2e;
  --critical-bg: #f8ded9;
  --marta: #2f6ba8;
  --marta-bg: #dde8f5;
  --atlas: #1a8f7d;
  --atlas-bg: #d9f0eb;
  --nexus: #7a4fb0;
  --nexus-bg: #ece1f7;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #0c141b;
    --panel: #121c25;
    --ink: #e7edf0;
    --steel: #93a2ab;
    --steel-soft: #6d7d86;
    --line: #24343e;
    --line-strong: #33454f;
    --accent: #ff8a44;
    --accent-ink: #1a0f08;
    --good: #47b586;
    --good-bg: #123425;
    --warn: #e0ac4a;
    --warn-bg: #3a2c11;
    --critical: #e2584a;
    --critical-bg: #3a1815;
    --marta: #6fa3de;
    --marta-bg: #17293c;
    --atlas: #4fc3ac;
    --atlas-bg: #0f322c;
    --nexus: #b48ce0;
    --nexus-bg: #2a1c3a;
  }
}
:root[data-theme="dark"] {
  --paper: #0c141b;
  --panel: #121c25;
  --ink: #e7edf0;
  --steel: #93a2ab;
  --steel-soft: #6d7d86;
  --line: #24343e;
  --line-strong: #33454f;
  --accent: #ff8a44;
  --accent-ink: #1a0f08;
  --good: #47b586;
  --good-bg: #123425;
  --warn: #e0ac4a;
  --warn-bg: #3a2c11;
  --critical: #e2584a;
  --critical-bg: #3a1815;
  --marta: #6fa3de;
  --marta-bg: #17293c;
  --atlas: #4fc3ac;
  --atlas-bg: #0f322c;
  --nexus: #b48ce0;
  --nexus-bg: #2a1c3a;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  background: var(--paper);
  color: var(--ink);
  font-family: "IBM Plex Sans", system-ui, sans-serif;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
}
.wrap { max-width: 1180px; margin: 0 auto; padding: 28px 20px 80px; }
a { color: inherit; }

.eyebrow {
  font-family: "IBM Plex Mono", monospace;
  font-size: 11.5px;
  letter-spacing: 0.11em;
  text-transform: uppercase;
  color: var(--steel);
  font-weight: 500;
}
h1, h2, h3 { font-family: "Big Shoulders Display", sans-serif; text-wrap: balance; margin: 0; }
.mono { font-family: "IBM Plex Mono", monospace; }
.tab-nums { font-variant-numeric: tabular-nums; }

/* ---- Masthead ---- */
.masthead {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 20px;
  padding-bottom: 18px;
  border-bottom: 2px solid var(--line-strong);
  margin-bottom: 22px;
  flex-wrap: wrap;
}
.masthead .mark { display: flex; align-items: baseline; gap: 12px; }
.masthead h1 { font-size: 34px; font-weight: 800; letter-spacing: 0.01em; }
.masthead .sub { color: var(--steel); font-size: 14px; }
.masthead .updated { text-align: right; }
.masthead .updated .eyebrow { display: block; margin-bottom: 2px; }
.masthead .updated .ts { font-family: "IBM Plex Mono", monospace; font-size: 13px; color: var(--ink); }
.back-link {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: "IBM Plex Mono", monospace; font-size: 12.5px;
  color: var(--steel); text-decoration: none; margin-bottom: 14px;
}
.back-link:hover { color: var(--ink); }

/* ---- Status strip ---- */
.status-strip {
  display: grid;
  grid-template-columns: auto 1fr 1fr 1fr;
  gap: 0;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 3px;
  margin-bottom: 26px;
  overflow: hidden;
}
.status-strip > div { padding: 16px 18px; border-right: 1px solid var(--line); }
.status-strip > div:last-child { border-right: none; }
.status-cell .label { font-family: "IBM Plex Mono", monospace; font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--steel); margin-bottom: 6px; }
.status-cell .value { font-size: 15px; font-weight: 500; }
.status-cell .value.mono { font-size: 14px; }

.pill {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 12px 5px 9px; border-radius: 999px;
  font-family: "IBM Plex Mono", monospace; font-size: 12.5px; font-weight: 600;
  letter-spacing: 0.03em; text-transform: uppercase; white-space: nowrap;
}
.pill .dot { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.pill.active { background: var(--good-bg); color: var(--good); }
.pill.active .dot { background: var(--good); box-shadow: 0 0 0 3px color-mix(in srgb, var(--good) 25%, transparent); }
.pill.waiting { background: var(--warn-bg); color: var(--warn); }
.pill.waiting .dot { background: var(--warn); }
.pill.idle { background: var(--line); color: var(--steel); }
.pill.idle .dot { background: var(--steel-soft); }
.pill.blocked, .pill.paused { background: var(--warn-bg); color: var(--warn); }
.pill.blocked .dot, .pill.paused .dot { background: var(--warn); }
.pill.error { background: var(--critical-bg); color: var(--critical); }
.pill.error .dot { background: var(--critical); }
.pill.retired { background: var(--line); color: var(--steel-soft); }
.pill.retired .dot { background: var(--steel-soft); }
.pill.watched { background: var(--line); color: var(--steel); }
.pill.watched .dot { background: var(--steel-soft); }

.agent-tag {
  display: inline-flex; align-items: center; gap: 5px;
  font-family: "IBM Plex Mono", monospace; font-size: 11.5px; font-weight: 600;
  padding: 3px 9px; border-radius: 3px; white-space: nowrap;
}
.agent-tag.founder { background: color-mix(in srgb, var(--accent) 16%, var(--panel)); color: var(--accent); }
.agent-tag.marta { background: var(--marta-bg); color: var(--marta); }
.agent-tag.atlas { background: var(--atlas-bg); color: var(--atlas); }
.agent-tag.nexus { background: var(--nexus-bg); color: var(--nexus); }

/* ---- Section scaffolding ---- */
section { margin-bottom: 34px; }
.section-head {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  margin-bottom: 14px; padding-bottom: 8px; border-bottom: 1px solid var(--line);
}
.section-head h2 { font-size: 21px; font-weight: 700; }
.section-head .count { font-family: "IBM Plex Mono", monospace; font-size: 12px; color: var(--steel); }
.section-note { font-size: 12.5px; color: var(--steel); margin: -6px 0 14px; }

/* ---- Org chart ---- */
.org-chart { display: flex; flex-direction: column; align-items: center; gap: 8px; margin-bottom: 8px; }
.org-ceo {
  background: var(--panel); border: 2px solid var(--accent); border-radius: 3px;
  padding: 14px 26px; text-align: center; min-width: 220px;
}
.org-ceo .name { font-family: "Big Shoulders Display", sans-serif; font-size: 22px; font-weight: 700; }
.org-ceo .role { font-size: 12px; color: var(--steel); text-transform: uppercase; letter-spacing: 0.06em; }
.org-connector { width: 1px; height: 18px; background: var(--line-strong); }
.org-row { display: flex; gap: 14px; flex-wrap: wrap; justify-content: center; width: 100%; }
.org-card {
  background: var(--panel); border: 1px solid var(--line); border-radius: 3px;
  padding: 14px 16px; flex: 1 1 220px; max-width: 280px;
  display: flex; flex-direction: column; gap: 8px;
  text-decoration: none; color: var(--ink);
  transition: border-color .15s;
}
.org-card:hover { border-color: var(--line-strong); }
.org-card .top { display: flex; justify-content: space-between; align-items: flex-start; gap: 6px; }
.org-card .name { font-family: "Big Shoulders Display", sans-serif; font-size: 19px; font-weight: 700; }
.org-card .role { font-size: 11.5px; color: var(--steel); text-transform: uppercase; letter-spacing: 0.05em; margin-top: -4px; }
.org-card .task { font-size: 12.5px; color: var(--ink); border-top: 1px dashed var(--line); padding-top: 8px; }
.org-card .task .label { display: block; font-family: "IBM Plex Mono", monospace; font-size: 9.5px; text-transform: uppercase; color: var(--steel); letter-spacing: 0.06em; margin-bottom: 2px; }
.org-card .more { font-family: "IBM Plex Mono", monospace; font-size: 11px; color: var(--steel); margin-top: 2px; }

/* ---- Cards grid (companies) ---- */
.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.card {
  background: var(--panel); border: 1px solid var(--line); border-radius: 3px;
  padding: 16px 18px; display: flex; flex-direction: column; gap: 10px;
}
.card.primary { border-left: 3px solid var(--accent); }
.card .card-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.card h3 { font-size: 19px; font-weight: 700; }
.card .stage { font-family: "IBM Plex Mono", monospace; font-size: 11px; color: var(--steel); text-transform: uppercase; letter-spacing: 0.06em; }
.card .metrics { display: flex; flex-wrap: wrap; gap: 10px 18px; font-size: 13px; }
.card .metrics .m b { display: block; font-family: "IBM Plex Mono", monospace; font-size: 16px; font-weight: 600; font-variant-numeric: tabular-nums; }
.card .metrics .m span { color: var(--steel); font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.04em; }
.card .decision { font-size: 13px; color: var(--steel); border-top: 1px solid var(--line); padding-top: 9px; margin-top: 2px; }
.card .decision b { color: var(--ink); font-weight: 600; }

/* ---- Goals ---- */
.goal-list { display: flex; flex-direction: column; gap: 12px; }
.goal-card { background: var(--panel); border: 1px solid var(--line); border-radius: 3px; padding: 16px 20px; }
.goal-card .gh { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 10px; }
.goal-card .gh h3 { font-size: 17px; font-weight: 700; }
.goal-progress { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.goal-bar { flex: 1; height: 8px; background: var(--line); border-radius: 4px; overflow: hidden; }
.goal-bar > span { display: block; height: 100%; background: var(--accent); border-radius: 4px; }
.goal-progress .gnum { font-family: "IBM Plex Mono", monospace; font-size: 13px; font-weight: 600; white-space: nowrap; }
.goal-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px 16px; font-size: 12.5px; margin-bottom: 10px; }
.goal-grid .g span { display: block; color: var(--steel); font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 2px; }
.goal-grid .g b { font-family: "IBM Plex Mono", monospace; font-weight: 600; }
.goal-card .decision { font-size: 13px; border-top: 1px solid var(--line); padding-top: 10px; color: var(--steel); }
.goal-card .decision b { color: var(--ink); }

/* ---- Metrics strip ---- */
.stat-row { display: grid; grid-template-columns: repeat(8, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 3px; overflow: hidden; }
.stat { background: var(--panel); padding: 14px 12px; text-align: left; }
.stat .n { font-family: "IBM Plex Mono", monospace; font-size: 24px; font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1.1; }
.stat .n.accent { color: var(--accent); }
.stat .l { font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--steel); margin-top: 4px; }

/* ---- Agents (org summary rows, used on detail pages) ---- */
.agent-list { display: flex; flex-direction: column; gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 3px; overflow: hidden; }
.agent { background: var(--panel); padding: 14px 18px; display: grid; grid-template-columns: 180px 1fr 220px; gap: 16px; align-items: center; }
.agent .who { display: flex; flex-direction: column; gap: 4px; }
.agent .who .name { font-weight: 600; font-size: 14.5px; }
.agent .who .role { font-size: 12px; color: var(--steel); }
.agent .task { font-size: 13px; }
.agent .task .label { font-family: "IBM Plex Mono", monospace; font-size: 10px; text-transform: uppercase; color: var(--steel); letter-spacing: 0.06em; display: block; margin-bottom: 2px; }
.agent .meta { text-align: right; font-size: 12px; color: var(--steel); }
.agent .meta .ts { font-family: "IBM Plex Mono", monospace; display: block; color: var(--ink); font-size: 12.5px; }

/* ---- Human required ---- */
.cfo-box { background: var(--panel); border: 1px solid var(--line); border-radius: 3px; padding: 22px 24px; display: flex; gap: 16px; align-items: center; }
.cfo-box.ok { border-left: 4px solid var(--good); }
.cfo-box.pending { border-left: 4px solid var(--critical); }
.cfo-box .icon { width: 40px; height: 40px; border-radius: 50%; flex: none; display: flex; align-items: center; justify-content: center; font-family: "IBM Plex Mono", monospace; font-weight: 700; font-size: 18px; }
.cfo-box.ok .icon { background: var(--good-bg); color: var(--good); }
.cfo-box.pending .icon { background: var(--critical-bg); color: var(--critical); }
.cfo-box .body b { display: block; font-size: 17px; margin-bottom: 2px; }
.cfo-box .body p { margin: 4px 0 0; font-size: 13.5px; color: var(--steel); }

/* Escalation card — used only when a genuine Human Required item is open */
.escalation { background: var(--panel); border: 1px solid var(--critical); border-radius: 3px; overflow: hidden; margin-bottom: 12px; }
.escalation-head { background: var(--critical-bg); color: var(--critical); padding: 10px 18px; display: flex; justify-content: space-between; align-items: center; gap: 10px; font-family: "IBM Plex Mono", monospace; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; }
.escalation-body { padding: 16px 18px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 24px; }
.escalation-body .e-full { grid-column: 1 / -1; }
.escalation-body .e { font-size: 13.5px; border-bottom: 1px dotted var(--line); padding-bottom: 8px; }
.escalation-body .e span { display: block; font-family: "IBM Plex Mono", monospace; font-size: 10px; text-transform: uppercase; color: var(--steel); letter-spacing: 0.06em; margin-bottom: 3px; }
.urgency-baixa { color: var(--steel); }
.urgency-media { color: var(--warn); }
.urgency-alta, .urgency-critica { color: var(--critical); font-weight: 700; }

/* ---- Automation health ---- */
.health-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.health-panel { background: var(--panel); border: 1px solid var(--line); border-radius: 3px; padding: 16px 18px; }
.health-panel h4 { font-family: "IBM Plex Mono", monospace; font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--steel); margin: 0 0 12px; font-weight: 600; }
.sys-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.sys-list li { display: flex; align-items: center; gap: 9px; font-size: 13.5px; }
.led { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.led.good { background: var(--good); box-shadow: 0 0 0 3px color-mix(in srgb, var(--good) 22%, transparent); }
.led.warn { background: var(--warn); }
.sys-list li .sys-meta { margin-left: auto; font-family: "IBM Plex Mono", monospace; font-size: 11.5px; color: var(--steel); }
.heartbeat-facts { display: flex; flex-direction: column; gap: 10px; }
.heartbeat-facts .row { display: flex; justify-content: space-between; font-size: 13.5px; border-bottom: 1px dotted var(--line); padding-bottom: 8px; }
.heartbeat-facts .row:last-child { border-bottom: none; padding-bottom: 0; }
.heartbeat-facts .row .k { color: var(--steel); }
.heartbeat-facts .row .v { font-family: "IBM Plex Mono", monospace; font-weight: 500; }

/* ---- Capabilities / Skills ---- */
.cap-list { display: flex; flex-direction: column; gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 3px; overflow: hidden; }
.cap-row { background: var(--panel); padding: 12px 16px; display: grid; grid-template-columns: 160px 1fr 140px 100px; gap: 14px; align-items: center; font-size: 13px; }
.cap-row .cn { font-weight: 600; }
.cap-row .ct { font-family: "IBM Plex Mono", monospace; font-size: 10.5px; text-transform: uppercase; color: var(--steel); letter-spacing: 0.05em; }
.cap-row .cd { color: var(--steel); font-size: 12.5px; }
.cap-row .cs { text-align: right; }

/* ---- Activity Log / Audit Trail ---- */
.audit-list { display: flex; flex-direction: column; gap: 10px; }
.audit-item { background: var(--panel); border: 1px solid var(--line); border-left: 3px solid var(--steel-soft); border-radius: 3px; padding: 12px 16px; }
.audit-item.status-success { border-left-color: var(--good); }
.audit-item.status-partial { border-left-color: var(--warn); }
.audit-item.status-failed, .audit-item.status-blocked { border-left-color: var(--critical); }
.audit-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 6px; }
.audit-head .ts { font-family: "IBM Plex Mono", monospace; font-size: 11.5px; color: var(--steel); }
.audit-status { font-family: "IBM Plex Mono", monospace; font-size: 10px; text-transform: uppercase; letter-spacing: 0.05em; padding: 2px 7px; border-radius: 2px; margin-left: auto; }
.audit-status.success { background: var(--good-bg); color: var(--good); }
.audit-status.partial { background: var(--warn-bg); color: var(--warn); }
.audit-status.failed, .audit-status.blocked { background: var(--critical-bg); color: var(--critical); }
.audit-body { font-size: 13.5px; }
.audit-body .action { font-weight: 600; }
.audit-meta { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 12px; color: var(--steel); margin-top: 6px; }
.audit-meta b { color: var(--ink); font-weight: 500; }

/* ---- Reports ---- */
.report-tabs { display: flex; gap: 8px; margin-bottom: 14px; }
.report-block { background: var(--panel); border: 1px solid var(--line); border-radius: 3px; padding: 18px 22px; margin-bottom: 14px; }
.report-block h3 { font-size: 17px; font-weight: 700; margin-bottom: 4px; }
.report-block .rmeta { font-family: "IBM Plex Mono", monospace; font-size: 11.5px; color: var(--steel); margin-bottom: 14px; }
.report-block h4 { font-family: "IBM Plex Mono", monospace; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--steel); margin: 14px 0 6px; }
.report-block h4:first-of-type { margin-top: 0; }
.report-block ul { margin: 0; padding-left: 18px; font-size: 13.5px; }
.report-block li { margin-bottom: 4px; }
.report-block p { font-size: 13.5px; margin: 0 0 6px; }

/* ---- Feed (legacy small entries, kept for narrative color alongside the audit trail) ---- */
.feed { position: relative; padding-left: 22px; }
.feed::before { content: ""; position: absolute; left: 5px; top: 6px; bottom: 6px; width: 1px; background: var(--line-strong); }
.feed-item { position: relative; padding-bottom: 18px; }
.feed-item:last-child { padding-bottom: 0; }
.feed-item::before { content: ""; position: absolute; left: -22px; top: 4px; width: 9px; height: 9px; border-radius: 50%; background: var(--panel); border: 2px solid var(--steel-soft); }
.feed-item.tag-decision::before { border-color: var(--accent); }
.feed-item.tag-error::before { border-color: var(--critical); }
.feed-item.tag-fix::before { border-color: var(--good); }
.feed-item .fh { display: flex; gap: 10px; align-items: baseline; margin-bottom: 3px; flex-wrap: wrap; }
.feed-item .ts { font-family: "IBM Plex Mono", monospace; font-size: 11.5px; color: var(--steel); white-space: nowrap; }
.feed-item .tag { font-family: "IBM Plex Mono", monospace; font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; padding: 2px 7px; border-radius: 2px; background: var(--line); color: var(--steel); }
.feed-item.tag-decision .tag { background: color-mix(in srgb, var(--accent) 16%, var(--panel)); color: var(--accent); }
.feed-item.tag-fix .tag { background: var(--good-bg); color: var(--good); }
.feed-item.tag-error .tag { background: var(--critical-bg); color: var(--critical); }
.feed-item p { margin: 0; font-size: 13.5px; }
.feed-item p b { font-weight: 600; }

footer {
  margin-top: 40px; padding-top: 16px; border-top: 1px solid var(--line);
  font-size: 12px; color: var(--steel-soft);
  display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px;
}
footer a { color: var(--steel); }

/* ---- Agent detail pages ---- */
.detail-header { display: flex; align-items: center; gap: 16px; margin-bottom: 8px; flex-wrap: wrap; }
.detail-header .name { font-family: "Big Shoulders Display", sans-serif; font-size: 40px; font-weight: 800; }
.field-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px 24px; margin-bottom: 24px; }
.field-grid .f { border-bottom: 1px dotted var(--line); padding-bottom: 8px; font-size: 13.5px; }
.field-grid .f span { display: block; font-family: "IBM Plex Mono", monospace; font-size: 10px; text-transform: uppercase; color: var(--steel); letter-spacing: 0.06em; margin-bottom: 3px; }
.tool-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chip { font-family: "IBM Plex Mono", monospace; font-size: 11.5px; background: var(--line); color: var(--steel); padding: 3px 9px; border-radius: 3px; }

@media (max-width: 880px) {
  .cards { grid-template-columns: 1fr; }
  .status-strip { grid-template-columns: 1fr 1fr; }
  .stat-row { grid-template-columns: repeat(4, 1fr); }
  .agent { grid-template-columns: 1fr; text-align: left; }
  .agent .meta { text-align: left; }
  .health-grid { grid-template-columns: 1fr; }
  .goal-grid { grid-template-columns: repeat(2, 1fr); }
  .cap-row { grid-template-columns: 1fr; gap: 4px; }
  .cap-row .cs { text-align: left; }
  .field-grid { grid-template-columns: 1fr; }
  .org-row { flex-direction: column; align-items: stretch; }
  .org-card { max-width: none; }
}
