.agent-shell {
  height: 100vh;
  padding: 18px;
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

.agent-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  margin-bottom: 16px;
}

/* Claim summary pills — inline cluster shown after Run Now button when the
   chat is pinned to a specific claim. Communicates claim type + potential
   value without competing with the primary Run Now CTA. */
.claim-summary-pills {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.claim-summary-pills[hidden] { display: none; }
.csp-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  white-space: nowrap;
  font-size: 12.5px;
  line-height: 1;
}
.csp-pill[hidden] { display: none; }
.csp-type {
  background: #F1F5FB;
  border: 1px solid #E2E8F0;
  color: #0D1526;
  font-weight: 600;
}
.csp-type .csp-icon {
  color: #64748B;
  font-size: 12px;
}
/* Claimant pill — sits between claim-type and potential-value. Subtle
   indigo tint so it reads as an identity chip rather than a metric. */
.csp-claimant {
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  color: #1e3a8a;
  font-weight: 600;
}
.csp-claimant .csp-icon {
  color: #4f46e5;
  font-size: 12px;
}
.csp-claimant .csp-label {
  font-family: var(--sans, "Inter", system-ui, sans-serif);
  font-size: 9.5px;
  font-weight: 700;
  color: #6366f1;
  text-transform: uppercase;
  letter-spacing: .6px;
  margin-right: 2px;
}
.csp-value {
  /* Light-red palette so the dollar figure reads as a "potential exposure"
     amount at a glance rather than a neutral metric. */
  background: linear-gradient(90deg, #fee2e2, #fff1f1);
  border: 1px solid #fecaca;
  color: #b91c1c;
  font-weight: 700;
  font-family: "Manrope", "Avenir Next", sans-serif;
  letter-spacing: .1px;
}
.csp-value .csp-label {
  font-family: var(--sans, "Inter", system-ui, sans-serif);
  font-size: 9.5px;
  font-weight: 700;
  color: #b91c1c;
  opacity: 0.7;
  text-transform: uppercase;
  letter-spacing: .6px;
  margin-right: 2px;
}

/* Left cluster: back link, title, claim badge, Run Now. Shrinks gracefully. */
.agent-header-left {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
  flex-wrap: wrap;
}

.agent-header-actions {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  justify-content: flex-end;
  flex-wrap: wrap;
}

/* Chat-header Run Now: primary CTA for the pinned entity. Made deliberately
   prominent so it stands out against the secondary (ghost) action buttons on
   the right side of the header. All key visual properties use !important to
   win against the generic .chat-action-btn rules defined later in this file. */
.chat-run-now-btn {
  display: inline-flex !important;
  align-items: center;
  gap: 7px;
  background: linear-gradient(180deg, #0468FF, #034BCC) !important;
  color: #fff !important;
  border: 1px solid #034BCC !important;
  border-radius: 10px !important;
  padding: 0 18px !important;
  height: 38px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(4, 104, 255, .32), 0 1px 2px rgba(4, 104, 255, .2) !important;
  transition: transform .1s ease, box-shadow .15s ease, opacity .15s ease, filter .15s ease;
  letter-spacing: .2px;
  white-space: nowrap;
}
.chat-run-now-btn[hidden] { display: none !important; }
.chat-run-now-btn:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(4, 104, 255, .35) !important;
  filter: brightness(1.04);
  color: #fff !important;
  border-color: #034BCC !important;
  background: linear-gradient(180deg, #1478ff, #0352CC) !important;
}
.chat-run-now-btn:disabled {
  opacity: .72;
  cursor: progress;
}
.chat-run-now-btn i { font-size: 12px; color: #fff !important; }

/* View Inputs: tertiary button that replaces the (i) icon that used to live
   inside the claim badge. It's visually quieter than Run Now but more
   discoverable than a 22px circle-info glyph. */
.view-inputs-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #EEF4FF;
  color: #0352CC !important;
  border: 1px solid #CFDDFF !important;
  font-weight: 600;
}
.view-inputs-btn:hover {
  background: #DCE8FF;
  border-color: #0352CC !important;
  color: #0352CC !important;
}
.view-inputs-btn[hidden] { display: none; }

/* Claim badge: appears between agent title and status when URL carries entity_id. */
.claim-context-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: linear-gradient(90deg, #EEF4FF, #FFFFFF);
  border: 1px solid #CFDDFF;
  border-radius: 10px;
  padding: 6px 12px;
  min-width: 0;
  box-shadow: 0 1px 3px rgba(4, 104, 255, .06);
}
.claim-context-badge[hidden] { display: none; }
.claim-context-badge .ccb-label {
  font-size: 9.5px;
  font-weight: 700;
  color: #0352CC;
  text-transform: uppercase;
  letter-spacing: .6px;
}
.claim-context-badge .ccb-id {
  font-family: "Manrope", "Avenir Next", sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: #0D1526;
  letter-spacing: .2px;
  white-space: nowrap;
}
.claim-context-badge .ccb-divider {
  width: 1px;
  height: 14px;
  background: #CFDDFF;
  flex-shrink: 0;
}
.claim-context-badge .ccb-meta {
  font-size: 11.5px;
  color: #4f5b88;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 260px;
}
.claim-context-badge .ccb-info {
  background: transparent;
  border: 1px solid #CFDDFF;
  color: #0352CC;
  border-radius: 999px;
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
  font-size: 12px;
  transition: background .15s ease, transform .1s ease;
}
.claim-context-badge .ccb-info:hover {
  background: #E5EEFF;
  transform: scale(1.05);
}
.claim-context-badge .ccb-info:focus-visible {
  outline: 2px solid #0352CC;
  outline-offset: 2px;
}

/* ── Claim inputs slide-out drawer ───────────────────────────── */
.inputs-drawer {
  position: fixed;
  inset: 0;
  z-index: 74;
}
.inputs-drawer[hidden] { display: none; }
.inputs-drawer-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(5, 10, 28, 0.44);
}
.inputs-drawer-panel {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(560px, 92vw);
  background: var(--panel-strong);
  border-left: 1px solid var(--line);
  box-shadow: -8px 0 32px rgba(5, 10, 28, .18);
  display: flex;
  flex-direction: column;
  animation: drawerSlideIn .26s cubic-bezier(.2, .9, .25, 1);
}
.inputs-drawer-panel > .inputs-drawer-body,
.inputs-drawer-panel > .inputs-drawer-chat {
  flex: 1 1 0;
  min-height: 0;
}
@keyframes drawerSlideIn {
  from { transform: translateX(100%); opacity: 0.6; }
  to   { transform: translateX(0); opacity: 1; }
}
.inputs-drawer-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 16px 18px;
  border-bottom: 1px solid var(--line);
}
.inputs-drawer-eyebrow {
  font-size: 10px;
  font-weight: 700;
  color: #0352CC;
  text-transform: uppercase;
  letter-spacing: .6px;
}
.inputs-drawer-title {
  font-size: 18px;
  margin: 3px 0 4px;
  font-family: "Manrope", sans-serif;
}
.inputs-drawer-sub {
  font-size: 12px;
  color: var(--muted);
}
.inputs-drawer-close {
  background: transparent;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 4px 10px;
  cursor: pointer;
  font-size: 13px;
}
.inputs-drawer-close:hover { background: var(--panel); }
.inputs-drawer-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 20px 8px;
  background: var(--panel, #f9fafb);
  border-bottom: 1px solid var(--line, #e4e7ec);
}
.inputs-drawer-back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #fff;
  border: 1px solid var(--line, #e4e7ec);
  border-radius: 6px;
  padding: 6px 12px;
  font-size: 12.5px;
  font-weight: 500;
  color: var(--text, #111827);
  cursor: pointer;
  transition: background 120ms ease, border-color 120ms ease;
}
.inputs-drawer-back:hover {
  background: var(--panel-strong, #eef2f6);
  border-color: #c9ced6;
}
.inputs-drawer-topbar .inputs-drawer-close {
  position: static;
}
.inputs-drawer-body {
  overflow: auto;
  padding: 14px 18px 20px;
  display: grid;
  gap: 12px;
  align-content: start;
}
.inputs-drawer-body[hidden] { display: none; }
.inputs-drawer-loading {
  color: var(--muted);
  font-size: 13px;
  padding: 18px 0;
  text-align: center;
}
.inputs-drawer-section {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--panel);
  padding: 10px 12px;
  display: grid;
  gap: 6px;
}
.inputs-drawer-section-title {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .06em;
  font-weight: 700;
}
.inputs-drawer-kv {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 13px;
  padding: 3px 0;
  border-bottom: 1px dashed rgba(0,0,0,.05);
}
.inputs-drawer-kv:last-child { border-bottom: 0; }
.inputs-drawer-kv span:first-child { color: var(--muted); }
.inputs-drawer-kv span:last-child {
  text-align: right;
  font-weight: 600;
  word-break: break-word;
}
.inputs-drawer-doc {
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--panel-strong);
  padding: 8px 10px;
  display: grid;
  gap: 4px;
}
.inputs-drawer-doc strong {
  font-size: 12px;
  font-weight: 600;
}
.inputs-drawer-doc pre {
  margin: 0;
  font-size: 11.5px;
  white-space: pre-wrap;
  word-break: break-word;
  max-height: 180px;
  overflow: auto;
  background: var(--panel);
  padding: 6px 8px;
  border-radius: 4px;
  border: 1px solid rgba(0,0,0,.04);
}
.inputs-drawer-doc-toggle {
  background: transparent;
  border: 0;
  color: var(--brand);
  cursor: pointer;
  font-size: 11.5px;
  padding: 0;
  text-align: left;
  width: max-content;
}
.inputs-drawer-doc-toggle:hover { text-decoration: underline; }

/* ──── Drawer tabs (Data / Chat with Data) ──────────────────── */
.inputs-drawer-tabs {
  display: flex;
  gap: 4px;
  padding: 6px 18px 0;
  background: var(--panel-strong);
  border-bottom: 1px solid var(--line);
}
.inputs-drawer-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  border: 1px solid transparent;
  border-bottom: none;
  border-radius: 8px 8px 0 0;
  padding: 9px 14px 10px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--muted);
  cursor: pointer;
  position: relative;
  bottom: -1px;
  transition: color 120ms ease, background 120ms ease;
}
.inputs-drawer-tab:hover { color: var(--text); }
.inputs-drawer-tab.is-active {
  color: #0352CC;
  background: var(--panel-strong);
  border-color: var(--line);
  border-bottom: 1px solid var(--panel-strong);
}
.inputs-drawer-tab i { font-size: 13px; }
.rag-source-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(3, 82, 204, 0.10);
  color: #0352CC;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .3px;
  text-transform: uppercase;
}
.rag-source-badge[hidden] { display: none; }
.rag-source-badge.scenario-green { background: rgba(22, 163, 74, 0.12); color: #15803d; }
.rag-source-badge.scenario-amber { background: rgba(217, 119, 6, 0.14); color: #b45309; }
.rag-source-badge.scenario-red   { background: rgba(220, 38, 38, 0.12); color: #b91c1c; }

/* ──── Chat with Data tab ───────────────────────────────────── */
.inputs-drawer-chat {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 14px 18px 18px;
  overflow: hidden;
  min-height: 0;
}
.inputs-drawer-chat[hidden] { display: none; }
.inputs-drawer-chat > #rag-chat-status,
.inputs-drawer-chat > #rag-chat-suggestions { flex: 0 0 auto; }
.inputs-drawer-chat > .rag-chat-log { flex: 1 1 0; min-height: 0; }
.inputs-drawer-chat > .rag-chat-form { flex: 0 0 auto; }
.rag-chat-status {
  font-size: 12px;
  color: var(--muted);
  background: rgba(217, 119, 6, 0.08);
  border: 1px solid rgba(217, 119, 6, 0.25);
  border-radius: 8px;
  padding: 8px 10px;
}
.rag-chat-status[hidden] { display: none; }
.rag-chat-suggestions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.rag-chat-suggestions:empty { display: none; }
.rag-chip {
  background: rgba(3, 82, 204, 0.06);
  color: #0352CC;
  border: 1px solid rgba(3, 82, 204, 0.18);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
  padding: 5px 11px;
  cursor: pointer;
  transition: background 100ms ease, border-color 100ms ease;
}
.rag-chip:hover { background: rgba(3, 82, 204, 0.12); border-color: rgba(3, 82, 204, 0.32); }
.rag-chat-log {
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow-y: auto;
  padding: 4px 2px;
  min-height: 0;
}
.rag-msg {
  max-width: 92%;
  padding: 9px 12px;
  border-radius: 12px;
  font-size: 13px;
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
}
.rag-msg-user {
  align-self: flex-end;
  background: #0352CC;
  color: #fff;
  border-bottom-right-radius: 4px;
}
.rag-msg-assistant {
  align-self: flex-start;
  background: var(--panel, #f4f6fb);
  color: var(--text, #111827);
  border: 1px solid var(--line, #e4e7ec);
  border-bottom-left-radius: 4px;
}
.rag-msg-error {
  align-self: stretch;
  background: rgba(220, 38, 38, 0.07);
  color: #b91c1c;
  border: 1px solid rgba(220, 38, 38, 0.20);
}
.rag-sources {
  margin-top: 8px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 11px;
  color: var(--muted);
  border-top: 1px dashed rgba(0, 0, 0, 0.1);
  padding-top: 6px;
}
.rag-sources-title {
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .4px;
  font-size: 10px;
}
.rag-source-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 8px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 11px;
  color: #0352CC;
  text-decoration: none;
  cursor: pointer;
  transition: background 100ms ease, border-color 100ms ease, color 100ms ease;
}
.rag-source-pill:hover {
  background: rgba(3, 82, 204, 0.08);
  border-color: rgba(3, 82, 204, 0.32);
  color: #023fa3;
}
.rag-source-pill i { color: #2b65d9; }
.rag-chat-typing { font-style: italic; color: var(--muted); }
.rag-chat-form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  align-items: end;
  padding-top: 10px;
  margin-bottom: 6px;
  border-top: 1px solid var(--line);
}
.rag-chat-suggestions[hidden] { display: none; }
.rag-chat-input {
  resize: none;
  min-height: 38px;
  max-height: 140px;
  padding: 9px 12px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: #fff;
  font: inherit;
  font-size: 13px;
  color: var(--text);
  outline: none;
  transition: border-color 100ms ease, box-shadow 100ms ease;
}
.rag-chat-input:focus {
  border-color: #0352CC;
  box-shadow: 0 0 0 3px rgba(3, 82, 204, 0.15);
}
.rag-chat-send {
  background: #0352CC;
  color: #fff;
  border: none;
  border-radius: 10px;
  width: 40px;
  height: 38px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 100ms ease, opacity 100ms ease;
}
.rag-chat-send:hover { background: #023fa3; }
.rag-chat-send:disabled { opacity: .5; cursor: not-allowed; }

/* SharePoint-style file list inside the Claim inputs drawer.
   Dot indicates availability (green = present, hollow = missing).
   Name is a link that opens the raw .docx in a new tab. */
.inputs-sp-table {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--line, #e4e7ec);
  border-radius: var(--radius-sm, 6px);
  overflow: hidden;
  background: var(--bg, #ffffff);
}
.inputs-sp-head,
.inputs-sp-row {
  display: grid;
  grid-template-columns: 14px 20px 1fr 110px;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
}
.inputs-sp-head {
  background: var(--panel, #f4f6fa);
  border-bottom: 1px solid var(--line, #e4e7ec);
  font-size: 11px;
  font-weight: 600;
  color: var(--muted, #6b7280);
  text-transform: uppercase;
  letter-spacing: .02em;
}
.inputs-sp-head-name,
.inputs-sp-head-date {
  display: inline-flex;
  align-items: center;
}
.inputs-sp-row {
  border-bottom: 1px solid var(--line, #eef0f3);
  transition: background 120ms ease;
}
.inputs-sp-row:last-child { border-bottom: 0; }
.inputs-sp-row:hover { background: rgba(37, 99, 235, 0.04); }
.inputs-sp-row-missing { background: transparent; }
.inputs-sp-row-missing:hover { background: rgba(0, 0, 0, 0.02); }

.inputs-doc-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex: none;
  display: inline-block;
  justify-self: center;
}
.inputs-doc-dot.present {
  background: #2ea44f;
  box-shadow: 0 0 0 2px rgba(46, 164, 79, 0.18);
}
.inputs-doc-dot.missing {
  background: transparent;
  border: 1.5px solid var(--line-strong, #c9ced6);
}
.inputs-doc-icon {
  font-size: 15px;
  color: var(--muted, #6b7280);
  justify-self: center;
}
.inputs-doc-icon-word { color: #2b579a; }
.inputs-doc-icon-pdf  { color: #d93025; }
.inputs-doc-icon-text { color: #4b5563; }
.inputs-doc-icon-missing { color: #c9ced6; }

.inputs-sp-name {
  font-size: 13px;
  font-weight: 500;
  color: var(--brand, #2563eb);
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.inputs-sp-name:hover {
  text-decoration: underline;
}
.inputs-sp-name.missing {
  color: var(--muted, #6b7280);
  font-weight: 500;
  cursor: default;
}
.inputs-sp-date {
  font-size: 12px;
  color: var(--muted, #6b7280);
  white-space: nowrap;
}
.inputs-sp-date.muted {
  font-style: italic;
  color: var(--muted, #9ca3af);
}

/* ── BM25 document search inside the Claim inputs drawer ─────── */
.inputs-search-section {
  border-color: var(--brand-200, #c7d8ff);
  background: linear-gradient(180deg, rgba(37,99,235,0.05), var(--panel));
}
.inputs-search-form {
  display: grid;
  grid-template-columns: 18px 1fr auto;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  background: var(--bg, #fff);
  border: 1px solid var(--line, #e4e7ec);
  border-radius: var(--radius-sm, 6px);
}
.inputs-search-form:focus-within {
  border-color: var(--brand, #2563eb);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}
.inputs-search-icon {
  color: var(--muted, #6b7280);
  font-size: 13px;
  justify-self: center;
}
.inputs-search-input {
  border: 0;
  outline: none;
  background: transparent;
  font-size: 13px;
  padding: 6px 0;
  color: var(--text, #111827);
  width: 100%;
}
.inputs-search-input::placeholder {
  color: var(--muted, #9ca3af);
}
.inputs-search-submit {
  border: 0;
  background: var(--brand, #2563eb);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: var(--radius-sm, 6px);
  cursor: pointer;
}
.inputs-search-submit:hover { filter: brightness(1.05); }
.inputs-search-submit:active { transform: translateY(1px); }

.inputs-search-results {
  display: grid;
  gap: 10px;
  margin-top: 4px;
}
.inputs-search-results:empty { display: none; }
.inputs-search-summary {
  font-size: 12px;
  color: var(--muted, #6b7280);
  padding: 2px 2px 4px;
}
.inputs-search-summary strong {
  color: var(--text, #111827);
  font-weight: 600;
}
.inputs-search-loading,
.inputs-search-empty,
.inputs-search-error {
  font-size: 13px;
  color: var(--muted, #6b7280);
  padding: 10px 12px;
  border: 1px dashed var(--line, #e4e7ec);
  border-radius: var(--radius-sm, 6px);
  background: var(--bg, #fff);
}
.inputs-search-error {
  color: #b91c1c;
  border-color: #fecaca;
  background: #fef2f2;
}
.inputs-search-file {
  border: 1px solid var(--line, #e4e7ec);
  border-radius: var(--radius-sm, 6px);
  background: var(--bg, #fff);
  overflow: hidden;
}
.inputs-search-file-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background: var(--panel, #f4f6fa);
  border-bottom: 1px solid var(--line, #e4e7ec);
}
.inputs-search-file-head .inputs-doc-icon {
  font-size: 14px;
}
.inputs-search-file-name {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--text, #111827);
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
a.inputs-search-file-name {
  color: var(--brand, #2563eb);
  text-decoration: none;
  cursor: pointer;
}
a.inputs-search-file-name:hover { text-decoration: underline; }
.inputs-search-file-count {
  font-size: 11px;
  color: var(--muted, #6b7280);
  background: rgba(37,99,235,0.08);
  padding: 2px 8px;
  border-radius: 10px;
  font-weight: 600;
}
.inputs-search-matches {
  list-style: none;
  margin: 0;
  padding: 0;
}
.inputs-search-match {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: start;
  padding: 8px 12px;
  border-bottom: 1px dashed rgba(0,0,0,0.06);
}
.inputs-search-match:last-child { border-bottom: 0; }
.inputs-search-snippet {
  font-size: 13px;
  line-height: 1.5;
  color: var(--text, #111827);
  word-break: break-word;
}
.inputs-search-snippet mark {
  background: #fff3a3;
  color: inherit;
  padding: 0 2px;
  border-radius: 2px;
  font-weight: 600;
}
.inputs-search-match-meta {
  display: flex;
  align-items: center;
  gap: 6px;
}
.inputs-search-score {
  font-size: 11px;
  font-weight: 700;
  color: #166534;
  background: #dcfce7;
  padding: 2px 8px;
  border-radius: 10px;
  white-space: nowrap;
}

/* ── Agent details modal ─────────────────────────────────────── */
.agent-details-modal {
  position: fixed;
  inset: 0;
  z-index: 74;
}
.agent-details-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(5, 10, 28, 0.54);
}
.agent-details-panel {
  position: absolute;
  top: 6vh;
  left: 50%;
  transform: translateX(-50%);
  width: min(860px, calc(100vw - 40px));
  max-height: 88vh;
  background: var(--panel-strong);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}
.agent-details-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
}
.agent-details-eyebrow {
  font-size: 10.5px;
  font-weight: 700;
  color: #0352CC;
  letter-spacing: .6px;
  text-transform: uppercase;
}
.agent-details-header h2 {
  font-size: 18px;
  margin: 3px 0 4px;
}
.agent-details-sub {
  margin: 0;
  font-size: 12.5px;
  color: var(--muted);
}
.agent-details-content {
  overflow: auto;
  padding: 14px 18px 18px;
  display: grid;
  gap: 12px;
  align-content: start;
}
.agent-details-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  border: 1px solid transparent;
}
.agent-details-pill.run   { background: #E5EEFF; color: #0352CC; border-color: #CFDDFF; }
.agent-details-pill.done  { background: #E6F7ED; color: #0E7C3A; border-color: #BEEACD; }
.agent-details-pill.warn  { background: #FFF4E0; color: #9A5B00; border-color: #FFD89C; }
.agent-details-pill.bad   { background: #FDECEE; color: #B42318; border-color: #F9CBD0; }
.agent-details-pill.pend,
.agent-details-pill.idle  { background: #F1F3F8; color: #4F5B88; border-color: #E3E8F2; }

.agent-details-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 8px;
}
.agent-details-stat {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--panel);
  padding: 8px 10px;
  display: grid;
  gap: 2px;
}
.agent-details-stat-label {
  font-size: 10.5px;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 700;
  letter-spacing: .04em;
}
.agent-details-stat-value {
  font-size: 15px;
  font-weight: 700;
  font-family: "Manrope", sans-serif;
}
.agent-details-section {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--panel);
  padding: 10px 12px;
  display: grid;
  gap: 6px;
}
.agent-details-section-title {
  font-size: 11.5px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .06em;
  font-weight: 700;
}
.agent-details-rationale {
  font-size: 13px;
  line-height: 1.55;
  color: var(--ink);
  white-space: pre-wrap;
}
.agent-details-rationale.muted {
  color: var(--muted);
  font-style: italic;
}

/* ── Per-agent IN / OUT block ─────────────────────────────────────────
   Two-column header that answers "what went into this agent and what
   came out". Each agent has its own builder; the layout below is shared. */
.agent-io-section {
  background: linear-gradient(180deg, #FAFCFF 0%, var(--panel) 100%);
}
.agent-io-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
@media (max-width: 720px) {
  .agent-io-grid { grid-template-columns: 1fr; }
}
.aio-panel {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #FFFFFF;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.aio-panel-in   { border-left: 3px solid #6B86FF; }
.aio-panel-out  { border-left: 3px solid #2EBA8C; }
.aio-panel-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  background: #F7F9FE;
  border-radius: var(--radius-md) var(--radius-md) 0 0;
}
.aio-panel-tag {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
  padding: 2px 6px;
  border-radius: 4px;
  background: #E8EEFF;
  color: #36479B;
}
.aio-panel-out .aio-panel-tag { background: #DEF6EB; color: #1A6E50; }
.aio-panel-title {
  font-size: 12px;
  font-weight: 700;
  color: var(--ink);
}
.aio-panel-body {
  padding: 8px 10px;
  display: grid;
  gap: 6px;
  font-size: 12.5px;
  color: var(--ink);
}
.aio-empty {
  color: var(--muted);
  font-style: italic;
  font-size: 12.5px;
  padding: 4px 0;
}
.aio-kv {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 8px;
  align-items: baseline;
}
.aio-kv-k {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--muted);
  font-weight: 700;
}
.aio-kv-v {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink);
  word-break: break-word;
}

/* Document list — used by A2 Intake OUT and A3 Extraction IN */
.aio-doc-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 4px;
}
.aio-doc-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #FBFCFE;
}
.aio-doc-name {
  display: flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  font-size: 12.5px;
  color: var(--ink);
  min-width: 0;
}
.aio-doc-name span {
  white-space: normal;
  word-break: break-word;
  overflow-wrap: anywhere;
}
.aio-doc-name i { color: var(--muted); }
.aio-doc-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.aio-doc-type {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.aio-doc-status {
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: 2px 6px;
  border-radius: 4px;
}
.aio-doc-status-ok   { background: #DEF6EB; color: #1A6E50; }
.aio-doc-status-bad  { background: #FCE4E4; color: #8C1F1F; }
.aio-doc-status-info { background: #E8EEFF; color: #36479B; }
.aio-doc-status-warn { background: #FEF3C7; color: #B45309; }
.aio-doc-count {
  margin-top: 4px;
  font-size: 11px;
  color: var(--muted);
  letter-spacing: .04em;
  text-transform: uppercase;
  font-weight: 700;
}

/* NIGO checklist — used by A4. Same shape on both sides; OUT panel
   adds present/missing markers + matched filename. */
.aio-checklist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 4px;
}
.aio-checklist-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #FBFCFE;
}
.aio-checklist-row-ok   { background: #F2FBF6; border-color: #BFE6CF; }
.aio-checklist-row-bad  { background: #FCF5F5; border-color: #EFC7C7; }
.aio-checklist-row-warn { background: #FFF8EC; border-color: #EFD4A6; }
.aio-checklist-marker {
  flex-shrink: 0;
  width: 18px;
  text-align: center;
  color: var(--muted);
  padding-top: 1px;
}
.aio-checklist-marker-ok   { color: #1F8A55; }
.aio-checklist-marker-bad  { color: #B33A3A; }
.aio-checklist-marker-warn { color: #B07A1A; }
.aio-checklist-body { display: grid; gap: 2px; min-width: 0; }
.aio-checklist-label {
  font-weight: 600;
  font-size: 12.5px;
  color: var(--ink);
}
.aio-checklist-alt {
  font-size: 11px;
  color: var(--muted);
  font-style: italic;
}
.aio-checklist-match {
  font-size: 11px;
  color: #1F8A55;
  font-weight: 600;
  word-break: break-all;
}
.aio-checklist-missing {
  font-size: 11px;
  color: #B33A3A;
  font-weight: 600;
}
.aio-checklist-info {
  font-size: 11px;
  color: #B07A1A;
  font-weight: 600;
}
.aio-checklist-summary {
  display: flex;
  gap: 6px;
  margin-top: 4px;
  flex-wrap: wrap;
}
.aio-summary-chip {
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: 3px 8px;
  border-radius: 12px;
}
.aio-summary-chip-ok   { background: #DEF6EB; color: #1A6E50; }
.aio-summary-chip-bad  { background: #FCE4E4; color: #8C1F1F; }
.aio-summary-chip-warn { background: #FFE9C5; color: #7E5210; }

/* Per-document field table — used by A3 Extraction OUT */
.aio-fld-group {
  border: 1px solid var(--line);
  border-radius: 6px;
  overflow: hidden;
  background: #FFFFFF;
}
.aio-fld-group + .aio-fld-group { margin-top: 6px; }
.aio-fld-group-empty { background: #FBFCFE; }
.aio-fld-group-empty .aio-fld-group-head { background: #F4F7FC; opacity: .85; }
.aio-fld-empty {
  padding: 8px 10px;
  font-size: 11.5px;
  color: var(--muted);
  font-style: italic;
}
.aio-fld-group-head {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  background: #F4F7FC;
  border-bottom: 1px solid var(--line);
  font-size: 12px;
  font-weight: 700;
  color: var(--ink);
}
.aio-fld-group-head i { color: var(--muted); }
.aio-fld-group-count {
  margin-left: auto;
  font-size: 10.5px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-weight: 700;
}
.aio-fld-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 12px;
}
/* Column widths are explicit so the Confidence + Page columns always
   reserve space — without table-layout:fixed the value column would
   eat the whole row and the bar would collapse. */
.aio-fld-table col.aio-col-field { width: 28%; }
.aio-fld-table col.aio-col-value { width: auto; }
.aio-fld-table col.aio-col-conf  { width: 96px; }
.aio-fld-table thead th {
  text-align: left;
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--muted);
  font-weight: 700;
  padding: 5px 8px;
  background: #FAFCFF;
  border-bottom: 1px solid var(--line);
}
.aio-fld-row td {
  padding: 5px 8px;
  border-bottom: 1px solid #EEF2F8;
  vertical-align: middle;
}
.aio-fld-row:last-child td { border-bottom: none; }
.aio-fld-name {
  font-weight: 600;
  color: var(--ink);
  white-space: normal;
  word-break: break-word;
  overflow-wrap: anywhere;
}
.aio-fld-value {
  color: var(--ink);
  /* Wrap long values rather than truncating, so reviewers don't lose
     the trailing characters of an address / diagnosis. */
  word-break: break-word;
  white-space: normal;
}
/* Confidence cell — bar above number on its own line so neither the
   bar nor the percentage gets clipped when the panel is narrow. */
.aio-fld-conf {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
  white-space: nowrap;
}
.aio-conf-bar {
  position: relative;
  display: block;
  width: 100%;
  max-width: 80px;
  height: 6px;
  background: #EAEFF8;
  border-radius: 999px;
  overflow: hidden;
}
.aio-conf-fill {
  position: absolute;
  inset: 0 auto 0 0;
  border-radius: 999px;
}
.aio-conf-ok   { background: #2EBA8C; }
.aio-conf-warn { background: #E9A23B; }
.aio-conf-bad  { background: #D4574B; }
.aio-conf-pct {
  font-size: 11px;
  font-weight: 700;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}

/* A1 Orchestrator — stage timeline */
.aio-timeline {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 4px;
  counter-reset: aio-tl;
}
.aio-tl-row {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #FBFCFE;
}
.aio-tl-row-ok   { border-color: #BFE6CF; background: #F2FBF6; }
.aio-tl-row-warn { border-color: #EFD4A6; background: #FFF8EC; }
.aio-tl-row-info { border-color: #C6D2EC; background: #F4F7FC; }
.aio-tl-marker {
  flex-shrink: 0;
  width: 18px;
  text-align: center;
  padding-top: 1px;
  color: var(--muted);
}
.aio-tl-row-ok .aio-tl-marker   { color: #1F8A55; }
.aio-tl-row-warn .aio-tl-marker { color: #B07A1A; }
.aio-tl-body { display: grid; gap: 2px; flex: 1; min-width: 0; }
.aio-tl-stage {
  font-weight: 700;
  font-size: 12.5px;
  color: var(--ink);
}
.aio-tl-meta {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-weight: 700;
}

/* Verdict block — used by A5/A6/A8 OUT */
.aio-verdict {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 8px 10px;
  border-radius: 6px;
  border: 1px solid var(--line);
  background: #FBFCFE;
}
.aio-verdict i { font-size: 18px; line-height: 1.2; padding-top: 1px; }
.aio-verdict-ok   { border-color: #BFE6CF; background: #F2FBF6; }
.aio-verdict-ok i { color: #1F8A55; }
.aio-verdict-bad  { border-color: #EFC7C7; background: #FCF5F5; }
.aio-verdict-bad i { color: #B33A3A; }
.aio-verdict-warn { border-color: #EFD4A6; background: #FFF8EC; }
.aio-verdict-warn i { color: #B07A1A; }
.aio-verdict-info { border-color: #C6D2EC; background: #F4F7FC; }
.aio-verdict-info i { color: #36479B; }
.aio-verdict-label {
  font-weight: 700;
  font-size: 13px;
  color: var(--ink);
}
.aio-verdict-detail {
  font-size: 12px;
  color: var(--muted);
  margin-top: 2px;
}

/* A7 Fraud — score block + indicators */
.aio-fraud-score {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #FBFCFE;
}
.aio-fraud-ok   { border-color: #BFE6CF; background: #F2FBF6; }
.aio-fraud-warn { border-color: #EFD4A6; background: #FFF8EC; }
.aio-fraud-bad  { border-color: #EFC7C7; background: #FCF5F5; }
.aio-fraud-num {
  font-family: "Manrope", sans-serif;
  font-weight: 800;
  font-size: 28px;
  color: var(--ink);
  line-height: 1;
}
.aio-fraud-denom {
  font-size: 14px;
  color: var(--muted);
  font-weight: 700;
}
.aio-fraud-band {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  color: var(--muted);
}
.aio-fraud-bad .aio-fraud-band  { color: #B33A3A; }
.aio-fraud-warn .aio-fraud-band { color: #B07A1A; }
.aio-fraud-ok .aio-fraud-band   { color: #1F8A55; }
.aio-indicators {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 4px;
}
.aio-indicator {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  padding: 6px 8px;
  border: 1px solid #EFD4A6;
  background: #FFF8EC;
  border-radius: 6px;
}
.aio-indicator i { color: #B07A1A; padding-top: 2px; }
.aio-indicator-label {
  font-weight: 700;
  font-size: 12.5px;
  color: var(--ink);
}
.aio-indicator-detail {
  font-size: 11.5px;
  color: var(--muted);
  margin-top: 1px;
}
.aio-no-indicators {
  font-size: 12px;
  color: #1F8A55;
  font-weight: 600;
  padding: 4px 0;
}

/* A8 Recommendation — agent-by-agent summary list, plus rationale/letter */
.aio-summary-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 4px;
}
.aio-summary-row {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 8px;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #FBFCFE;
  font-size: 12px;
  align-items: baseline;
}
.aio-summary-agent {
  font-weight: 800;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--muted);
}
.aio-summary-finding {
  color: var(--ink);
  word-break: break-word;
}
.aio-rec-rationale {
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--ink);
  white-space: pre-wrap;
  border-left: 2px solid var(--line);
  padding: 2px 0 2px 8px;
}
.aio-rec-letter {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--ink);
  padding: 6px 8px;
  border: 1px dashed var(--line);
  border-radius: 6px;
  background: #FBFCFE;
}
.aio-rec-letter i { color: var(--muted); }

/* Rationale cards — a clean, structured re-render of raw reasoning text
   so users see a title, evidence, detection list, and key/value chips
   instead of a wall of backticks and pipes. */
.adr-cards {
  display: grid;
  gap: 8px;
}
.adr-card {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--panel-strong);
}
.adr-icon {
  font-size: 14px;
  color: #0352CC;
  background: #E5EEFF;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  border: 1px solid #CFDDFF;
}
.adr-card-body {
  display: grid;
  gap: 6px;
  min-width: 0;
}
.adr-body {
  font-size: 13px;
  line-height: 1.5;
  color: var(--ink);
  word-wrap: break-word;
}
.adr-evidence {
  margin: 2px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 6px;
}
.adr-evidence > li {
  display: grid;
  gap: 3px;
  padding: 6px 8px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 6px;
}
.adr-evidence-label {
  font-size: 11px;
  font-weight: 700;
  color: #9A5B00;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.adr-evidence-token {
  font-family: "IBM Plex Mono", "SFMono-Regular", monospace;
  font-size: 11px;
  color: var(--muted);
  word-break: break-all;
}
.adr-evidence-quote {
  margin: 0;
  padding: 4px 8px;
  border-left: 2px solid #FFD89C;
  background: #FFF9EC;
  color: #5B3A00;
  font-size: 12px;
  font-style: italic;
  white-space: pre-wrap;
  word-break: break-word;
  border-radius: 0 4px 4px 0;
}
.adr-bullets {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 3px;
  font-size: 12.5px;
  color: var(--ink);
}
.adr-bullets li { line-height: 1.45; }
.adr-kv-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 2px;
}
.adr-chip {
  display: inline-flex;
  align-items: center;
  gap: 0;
  border: 1px solid var(--line);
  border-radius: 999px;
  overflow: hidden;
  background: var(--panel);
  font-size: 11.5px;
}
.adr-chip-k {
  padding: 2px 8px;
  color: var(--muted);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  font-size: 10.5px;
  background: rgba(3, 82, 204, .06);
}
.adr-chip-v {
  padding: 2px 10px;
  color: var(--ink);
  font-weight: 600;
  font-family: "IBM Plex Mono", "SFMono-Regular", monospace;
}
.adr-chip-link {
  text-decoration: none;
  cursor: pointer;
}
.adr-chip-link:hover .adr-chip-v {
  text-decoration: underline;
  color: var(--brand);
}
.agent-details-event {
  border: 1px solid var(--line);
  background: var(--panel-strong);
  border-radius: var(--radius-sm);
  padding: 8px 12px;
  display: grid;
  grid-template-rows: auto auto;
  gap: 4px;
  font-size: 13px;
  align-items: baseline;
}
.agent-details-event-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.agent-details-event-ts {
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  font-size: 11.5px;
  white-space: nowrap;
}
.agent-details-event-tag {
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #4F5B88;
  padding: 2px 8px;
  border-radius: 999px;
  background: #E3E8F2;
  width: max-content;
  white-space: nowrap;
}
.agent-details-event-tag.err  { background: #FDECEE; color: #B42318; }
.agent-details-event-tag.warn { background: #FFF4E0; color: #9A5B00; }
.agent-details-event-tag.ok   { background: #E6F7ED; color: #0E7C3A; }
.agent-details-event-summary {
  word-break: break-word;
  line-height: 1.5;
  color: var(--ink);
}
.agent-details-empty {
  color: var(--muted);
  font-size: 12.5px;
  font-style: italic;
  padding: 6px 0;
}
.agent-details-kv {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 12.5px;
  padding: 3px 0;
  border-bottom: 1px dashed rgba(0,0,0,.05);
}
.agent-details-kv:last-child { border-bottom: 0; }
.agent-details-kv span:first-child { color: var(--muted); }
.agent-details-kv span:last-child { font-weight: 600; word-break: break-word; text-align: right; }

/* A7 feed-vs-document validations table + summary chips (LoanOps). */
.ad-valstats {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 8px;
}
.ad-statchip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  color: #2D3748;
  background: #F8FAFC;
  border: 1px solid #E2E8F0;
  border-radius: 999px;
  padding: 2px 9px;
}
.ad-statchip strong { color: #0D1526; font-weight: 700; }
.ad-statchip-ok { background: #ECFDF5; border-color: #BBF7D0; color: #059669; }
.ad-statchip-ok strong { color: #059669; }
.ad-statchip-warn { background: #FFFBEB; border-color: #FDE68A; color: #D97706; }
.ad-statchip-warn strong { color: #D97706; }
.ad-valtable {
  display: grid;
  grid-template-columns: 1fr;
  border: 1px solid #E2E8F0;
  border-radius: 6px;
  overflow: hidden;
}
.ad-valrow {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 6px 10px;
  font-size: 11.5px;
  color: #2D3748;
  border-top: 1px solid #E2E8F0;
}
.ad-valrow:first-child { border-top: none; }
.ad-valfield { font-weight: 500; color: #0D1526; word-break: break-word; }
.ad-valstatus {
  font-size: 10.5px;
  padding: 1px 8px;
  border-radius: 999px;
  font-weight: 600;
  white-space: nowrap;
}
.ad-valrow-ok .ad-valstatus { background: #ECFDF5; color: #059669; }
.ad-valrow-bad .ad-valstatus { background: #FEF2F2; color: #DC2626; }
.ad-valrow-info .ad-valstatus { background: #F8FAFC; color: #64748B; }

/* View-details button in left panel agent rows */
.agent-runtime-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 4px;
}
.agent-runtime-details-btn {
  background: transparent;
  border: 1px solid var(--line);
  color: var(--brand);
  font-size: 11px;
  padding: 3px 8px;
  border-radius: 999px;
  cursor: pointer;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.agent-runtime-details-btn:hover {
  background: #E5EEFF;
  border-color: #CFDDFF;
}

/* Clickable adjudication tiles */
.adj-atile {
  cursor: pointer;
  transition: transform .12s ease, box-shadow .12s ease;
}
.adj-atile:hover {
  transform: translateY(-1px);
  box-shadow: 0 3px 10px rgba(4, 104, 255, .12);
}
.adj-atile:focus-visible {
  outline: 2px solid #0352CC;
  outline-offset: 2px;
}

#architecture-button {
  height: 30px;
  padding: 0 10px;
  font-size: 12px;
}

.back-link {
  color: var(--muted);
  font-weight: 600;
}

.agent-title {
  display: flex;
  align-items: center;
  gap: 14px;
}

.agent-title h1 {
  font-size: 26px;
}

.agent-status {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  background: var(--panel);
  border: 1px solid var(--line);
  padding: 10px 14px;
  border-radius: 999px;
}

.status-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--ok);
}

.status-dot.status-running {
  background: var(--ok);
  animation: statusBlink 1s ease-in-out infinite;
}

.status-dot.status-paused {
  background: var(--warn);
}

.status-dot.status-done,
.status-dot.status-ready {
  background: #98a2b3;
}

.status-dot.status-failed {
  background: #b42318;
}

/* SIU escalation — loud, red, pulsing so the banner can't be missed
   when a claim is quarantined. The dot animates on the same cadence as
   `status-running` to read as "active alert" rather than "complete". */
.status-dot.status-siu {
  background: #dc2626;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.28) !important;
  animation: statusBlink 1s ease-in-out infinite;
}

/* When the SIU dot lights up, recolor the status chip with a loud red
   treatment so the entire pill reads as escalated. The chip stays inline
   as a sibling of View Inputs / Run Now in `.ah-actions` rather than being
   absolute-centered (which previously overlapped those buttons). */
.ah-status:has(.status-dot.status-siu) {
  background: rgba(220, 38, 38, 0.18);
  border-color: rgba(248, 113, 113, 0.55);
  color: #fff5f5;
  font-weight: 700;
  letter-spacing: 0.3px;
  text-transform: uppercase;
  box-shadow: 0 4px 14px rgba(220, 38, 38, 0.28);
}
.ah-status:has(.status-dot.status-siu) .status-dot {
  width: 10px;
  height: 10px;
}

@keyframes statusBlink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.35; }
}

.agent-layout {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr) 320px;
  gap: 16px;
  min-height: 0;
  overflow: hidden;
}

.chat-pane,
.tools-pane,
.trail-pane {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
}

.chat-pane {
  display: grid;
  /* Rows: chat stream | file-preview | adj-gate floating host | composer.
     The middle "auto" rows collapse to 0 when their elements are
     hidden, so there's no placeholder gap above the input bar when no
     gate is open. */
  grid-template-rows: minmax(0, 1fr) auto auto auto;
  min-height: 0;
  overflow: hidden;
  position: relative;
}

.chat-stream {
  padding: 18px;
  overflow: hidden;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.chat-log { flex: 1 1 auto; }

.chat-log {
  display: grid;
  gap: 14px;
  overflow: auto;
  min-height: 0;
  padding-right: 6px;
  align-content: start;
  justify-items: start;
}

.message {
  max-width: 86%;
  border-radius: var(--radius-md);
  padding: 14px 16px;
  line-height: 1.55;
  background: var(--panel-strong);
  border: 1px solid var(--line);
  align-self: start;
  height: fit-content;
  animation: msgSlideIn 0.2s ease forwards;
}

@keyframes msgSlideIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

.message.user {
  justify-self: end;
  background: linear-gradient(135deg, var(--brand), var(--ink));
  color: #fff;
}

.message.assistant {
  justify-self: start;
  width: min(86%, 760px);
}

.message .sender {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 8px;
  color: var(--muted);
}

.message.user .sender {
  color: rgba(255, 255, 255, 0.76);
}

.message-body {
  min-width: 0;
}

.message-body p {
  margin: 0 0 0.85em;
}

.message-body p:last-child {
  margin-bottom: 0;
}

.message-body h1,
.message-body h2,
.message-body h3,
.message-body h4,
.message-body h5,
.message-body h6 {
  margin: 0 0 0.7em;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

.message-body h1 { font-size: 1.6rem; }
.message-body h2 { font-size: 1.4rem; }
.message-body h3 { font-size: 1.22rem; }
.message-body h4 { font-size: 1.08rem; }

.message-body blockquote {
  margin: 0.8em 0;
  padding: 0.1em 0 0.1em 1em;
  border-left: 3px solid var(--brand);
  color: var(--muted);
}

.message-body ul,
.message-body ol {
  margin: 0.4em 0 0.9em 1.2em;
  padding: 0;
}

.message-body li {
  margin: 0.3em 0;
}

.message-body code {
  font-family: "IBM Plex Mono", "SFMono-Regular", monospace;
  background: rgba(var(--ink-rgb, 0, 10, 98), 0.08);
  border-radius: var(--radius-sm);
  padding: 0.1em 0.35em;
}

.message.user .message-body code {
  background: rgba(255, 255, 255, 0.16);
}

.message-body pre {
  margin: 0.9em 0;
  padding: 12px 14px;
  border-radius: var(--radius-md);
  overflow: auto;
  background: var(--ink);
  color: #ffffff;
}

.message-body pre code {
  background: transparent;
  padding: 0;
}

.message-body a {
  color: var(--brand);
  text-decoration: underline;
}

.message-body .md-table-wrap {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  margin: 0.9em 0;
}

.message-body table {
  display: block;
  width: 100%;
  max-width: 100%;
  border-collapse: collapse;
  margin: 0;
  font-size: 0.96rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  overflow-x: auto;
}

.message-body th,
.message-body td {
  padding: 10px 12px;
  text-align: left;
  border-bottom: 1px solid var(--line);
  vertical-align: top;
  white-space: normal;
  word-break: break-word;
}

.message-body th {
  background: rgba(var(--brand-rgb), 0.08);
  font-weight: 700;
}

.message-body tr:last-child td {
  border-bottom: 0;
}

.message-body hr {
  border: 0;
  border-top: 1px solid var(--line);
  margin: 1em 0;
}

.message-body > *:first-child {
  margin-top: 0;
}

.message-body > *:last-child {
  margin-bottom: 0;
}

.summary-card,
.verification-card,
.exception-card,
.receipt-card,
.resolved-card {
  margin-top: 12px;
  padding: 12px;
  border-radius: 16px;
  border: 1px solid var(--line);
  background: #fafafa;
}

.verification-card {
  display: flex;
  align-items: center;
  gap: 8px;
}

.verification-icon {
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--brand);
}

.verification-card-finguard .verification-icon {
  color: #0f766e;
}

.verification-card-finguard {
  border-color: rgba(var(--brand-rgb), 0.35);
  background: rgba(var(--brand-rgb), 0.08);
}

.fg-rule-card {
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
}

.fg-rule-head {
  display: flex;
  align-items: center;
  gap: 8px;
}

.fg-rule-head strong {
  flex: 1;
}

.fg-rule-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.fg-rule-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  background: rgba(0, 0, 0, 0.03);
  border-radius: 6px;
  font-size: 0.875rem;
}

.fg-rule-name {
  flex: 1;
  font-weight: 500;
}

.fg-rule-sev {
  font-size: 0.7rem;
  letter-spacing: 0.05em;
  color: var(--muted);
}

.fg-rule-pill {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 2px 8px;
  border-radius: 12px;
  white-space: nowrap;
}

.fg-rule-pill-ok {
  background: rgba(var(--ok-rgb), 0.18);
  color: var(--ok);
}

.fg-rule-pill-bad {
  background: rgba(var(--bad-rgb), 0.18);
  color: var(--bad);
}

.fg-rule-pill-warn {
  background: rgba(217, 119, 6, 0.18);
  color: #b45309;
}

/* ── Collapsed FinGuard summary card (post-validation) ── */
.fg-summary-details {
  margin: 0;
}
.fg-summary-details > .fg-summary-head {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 8px;
  user-select: none;
}
.fg-summary-details > .fg-summary-head::-webkit-details-marker { display: none; }
.fg-summary-details > .fg-summary-head > span:nth-of-type(1) { flex: 1; }
.fg-summary-chev {
  font-size: 0.75rem;
  color: var(--muted);
  transition: transform .15s ease;
  margin-left: 4px;
}
.fg-summary-details[open] > .fg-summary-head .fg-summary-chev {
  transform: rotate(180deg);
}
.fg-summary-body {
  margin-top: 10px;
}

.aio-fg-note {
  font-size: 0.78rem;
  color: var(--muted);
  margin: 6px 0 8px;
  padding: 6px 10px;
  background: rgba(0, 0, 0, 0.03);
  border-left: 3px solid rgba(var(--brand-rgb), 0.5);
  border-radius: 4px;
}

.aio-fg-config {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 6px 0 10px;
  padding: 6px 10px;
  font-size: 0.78rem;
  color: var(--muted);
}

.aio-fg-config-label {
  font-weight: 500;
}

.aio-fg-config-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px;
  font-size: 0.78rem;
  font-weight: 500;
  color: rgb(var(--brand-rgb));
  background: rgba(var(--brand-rgb), 0.08);
  border: 1px solid rgba(var(--brand-rgb), 0.35);
  border-radius: 4px;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.12s ease, border-color 0.12s ease;
}

.aio-fg-config-btn:hover {
  background: rgba(var(--brand-rgb), 0.16);
  border-color: rgba(var(--brand-rgb), 0.55);
}

.aio-fg-config-btn .fa-plus {
  font-size: 0.7rem;
}

.run-finguard-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  margin-top: 8px;
}

.run-finguard-table th,
.run-finguard-table td {
  text-align: left;
  padding: 6px 10px;
  border-bottom: 1px solid var(--line);
}

.run-finguard-table thead th {
  font-weight: 600;
  color: var(--muted);
  font-size: 11px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.pin-fg-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.pin-fg-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 8px;
  background: rgba(0, 0, 0, 0.03);
  border-radius: 4px;
  font-size: 13px;
}

.pin-fg-name {
  flex: 1;
}

.resolved-card {
  background: rgba(var(--ok-rgb), 0.08);
  border-color: rgba(var(--ok-rgb), 0.3);
  border-left: 4px solid var(--ok);
  color: var(--ok);
  font-weight: 600;
}

.resolved-card.resolved-reject,
.resolved-card.resolved-skipped {
  background: rgba(var(--muted-rgb), 0.12);
  border-color: rgba(var(--muted-rgb), 0.4);
  border-left-color: rgba(var(--muted-rgb), 0.85);
  color: var(--muted);
}

.resolved-card.resolved-reject {
  background: rgba(180, 35, 24, 0.1);
  border-color: rgba(180, 35, 24, 0.35);
  border-left-color: #b42318;
  color: #b42318;
}

.resolved-card.resolved-escalate {
  background: rgba(180, 35, 24, 0.12);
  border-color: rgba(180, 35, 24, 0.35);
  border-left-color: #b42318;
  color: #b42318;
}

.summary-card {
  display: grid;
  gap: 4px;
}

.summary-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 2px 0;
}

.summary-ids {
  font-family: "IBM Plex Mono", "SFMono-Regular", monospace;
  font-size: 12px;
  color: var(--brand);
  margin-top: 2px;
}

.summary-ids code {
  background: rgba(var(--brand-rgb), 0.1);
  padding: 1px 5px;
  border-radius: var(--radius-sm);
}

.gate-notice {
  margin-top: 12px;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(var(--accent-rgb), 0.35);
  border-left: 4px solid var(--warn);
  background: rgba(var(--accent-rgb), 0.08);
  display: grid;
  gap: 4px;
}

.gate-notice strong {
  color: var(--warn);
}

.gate-notice-ids {
  font-family: "IBM Plex Mono", "SFMono-Regular", monospace;
  font-size: 12px;
  color: var(--muted);
  margin-top: 2px;
}

.exception-card {
  border-left: 4px solid var(--warn);
}

.status-list-card {
  display: grid;
  gap: 6px;
  margin-top: 12px;
  padding: 12px;
  border-radius: var(--radius-md);
  background: #ffffff;
  border: 1px solid var(--line);
}

/* ── Feed scan cards ─────────────────────────────────────────── */

.scan-feed-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.scan-feed-card {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 14px 52px 14px 14px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: #ffffff;
}

.scan-feed-dot {
  display: inline-block;
  width: 3px;
  height: 3px;
  border-radius: 999px;
  margin-top: 8px;
  opacity: 0.5;
  flex: 0 0 auto;
}

.scan-feed-main {
  min-width: 0;
  width: 100%;
}

.scan-feed-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.scan-feed-name {
  font-size: 14px;
  line-height: 1.35;
  word-break: break-word;
  color: var(--ink);
}

.scan-feed-meta {
  margin-top: 4px;
  font-size: 12px;
  color: var(--muted);
}

.scan-feed-detail {
  margin-top: 4px;
  font-size: 12px;
  color: var(--ink);
  line-height: 1.35;
  word-break: break-word;
}

.scan-feed-key {
  color: var(--muted);
  margin-right: 6px;
}

.scan-info-btn {
  position: absolute;
  right: 12px;
  bottom: 12px;
  width: 30px;
  height: 30px;
  border-radius: 999px;
  border: 1px solid rgba(var(--brand-rgb), 0.38);
  background: rgba(var(--brand-rgb), 0.1);
  color: var(--brand);
  box-shadow: 0 8px 18px rgba(var(--brand-rgb), 0.16);
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  z-index: 1;
  transition: transform 0.12s ease, background 0.12s ease, box-shadow 0.12s ease, border-color 0.12s ease;
}

.scan-info-btn:hover {
  background: rgba(var(--brand-rgb), 0.18);
  color: var(--brand);
  border-color: rgba(var(--brand-rgb), 0.55);
  box-shadow: 0 10px 22px rgba(var(--brand-rgb), 0.22);
  transform: translateY(-1px);
}

.scan-feed-actions {
  margin-top: 10px;
  padding-right: 36px;
}

.scan-process-btn {
  height: 28px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--line);
  padding: 0 12px;
  font-size: 12px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  background: rgba(var(--brand-rgb), 0.08);
  color: var(--brand);
}

.scan-process-btn:hover {
  background: rgba(var(--brand-rgb), 0.16);
}

.scan-process-btn[disabled] {
  opacity: 0.5;
  cursor: default;
}

.claim-final-card {
  margin-bottom: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--line);
  display: grid;
  gap: 4px;
}

.claim-final-card code {
  background: rgba(var(--ink-rgb), 0.08);
  padding: 1px 5px;
  border-radius: var(--radius-sm);
}

.claim-final-card-accepted {
  background: rgba(var(--ok-rgb), 0.1);
  border-color: rgba(var(--ok-rgb), 0.35);
  border-left: 4px solid var(--ok);
}

.claim-final-card-rejected {
  background: rgba(180, 35, 24, 0.09);
  border-color: rgba(180, 35, 24, 0.35);
  border-left: 4px solid #b42318;
}

.decision-outcome-card {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--line);
  display: grid;
  gap: 4px;
}

.decision-outcome-card-resolved {
  background: rgba(var(--ok-rgb), 0.1);
  border-color: rgba(var(--ok-rgb), 0.35);
  border-left: 4px solid var(--ok);
  color: var(--ok);
}

.decision-outcome-card-rejected {
  background: rgba(180, 35, 24, 0.09);
  border-color: rgba(180, 35, 24, 0.35);
  border-left: 4px solid #b42318;
  color: #b42318;
}

.decision-outcome-card-skipped {
  background: rgba(var(--muted-rgb), 0.12);
  border-color: rgba(var(--muted-rgb), 0.42);
  border-left: 4px solid rgba(var(--muted-rgb), 0.9);
  color: var(--muted);
}

.composer {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: end;
  gap: 10px;
  padding: 0 18px 12px;
  border-top: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(255,255,255,0.72), rgba(255,255,255,0.96));
  position: relative;
  z-index: 2;
}

.composer textarea {
  resize: none;
  min-height: 56px;
  max-height: 160px;
  padding: 14px 16px;
  border-radius: var(--radius-md);
  border: 1px solid var(--line);
  background: #fff;
}

#send-button {
  height: 30px;
  padding: 0 12px;
  font-size: 13px;
  line-height: 1;
  border-radius: var(--radius-sm);
  display: inline-flex;
  align-items: center;
}

.composer-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 18px;
  padding: 0 18px 18px;
  color: var(--muted);
  background: linear-gradient(180deg, rgba(255,255,255,0.96), rgba(255,255,255,1));
  position: relative;
  z-index: 2;
}

.upload-link {
  cursor: pointer;
  color: var(--brand);
  font-weight: 600;
}

.chat-action-btn {
  height: 28px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--line);
  padding: 0 12px;
  font-size: 12px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
}

.thinking {
  display: inline-flex;
  gap: 6px;
  padding: 2px 0;
  align-items: center;
}

.thinking span {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--muted);
  animation: blink 1s infinite ease-in-out;
}

.thinking-bubble {
  justify-self: start;
}

.thinking span:nth-child(2) { animation-delay: 0.15s; }
.thinking span:nth-child(3) { animation-delay: 0.3s; }

.drop-active {
  outline: 2px dashed var(--brand);
  outline-offset: -8px;
  background: rgba(var(--brand-rgb), 0.06);
}

/* ── File preview bar ───────────────────────────────────────── */

.file-preview-bar {
  margin: 0 18px 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--panel-strong);
  padding: 12px 14px;
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  align-items: center;
  gap: 12px;
  animation: msgSlideIn 0.18s ease forwards;
}

.file-preview-icon {
  font-size: 22px;
  line-height: 1;
}

.file-preview-meta {
  min-width: 0;
}

.file-preview-name {
  font-weight: 600;
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--ink);
}

.file-preview-size {
  font-size: 11px;
  color: var(--muted);
  margin-top: 2px;
}

.file-preview-content {
  grid-column: 1 / -1;
  margin-top: 8px;
}

.file-preview-content pre {
  margin: 0;
  padding: 8px 10px;
  border-radius: var(--radius-sm);
  background: rgba(var(--ink-rgb), 0.06);
  font-family: "IBM Plex Mono", "SFMono-Regular", monospace;
  font-size: 11px;
  line-height: 1.5;
  color: var(--ink);
  overflow: auto;
  max-height: 110px;
  white-space: pre-wrap;
  word-break: break-word;
}

.file-preview-upload {
  height: 28px;
  padding: 0 12px;
  font-size: 12px;
  line-height: 1;
  border-radius: var(--radius-sm);
  display: inline-flex;
  align-items: center;
}

.file-preview-remove {
  height: 28px;
  padding: 0 10px;
  font-size: 12px;
  line-height: 1;
  border-radius: var(--radius-sm);
  border: 1px solid var(--line);
  background: transparent;
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  transition: background 0.12s, color 0.12s, border-color 0.12s;
}

.file-preview-remove:hover {
  background: rgba(180, 35, 24, 0.08);
  color: #b42318;
  border-color: rgba(180, 35, 24, 0.35);
}

/* ── Pipeline running top-border pulse ──────────────────────── */

.agent-shell.pipeline-running .chat-pane {
  border-top: 3px solid var(--brand);
  animation: pipelinePulse 1.8s ease-in-out infinite;
}

@keyframes pipelinePulse {
  0%, 100% { border-top-color: var(--brand); }
  50%       { border-top-color: rgba(var(--brand-rgb), 0.35); }
}

/* ── CSS-only spinner for subtitle ─────────────────────────── */

.subtitle-spinner {
  display: inline-block;
  width: 10px;
  height: 10px;
  border: 2px solid rgba(var(--brand-rgb), 0.25);
  border-top-color: var(--brand);
  border-radius: 50%;
  animation: spinnerRotate 0.7s linear infinite;
  margin-right: 6px;
  vertical-align: middle;
  flex-shrink: 0;
}

@keyframes spinnerRotate {
  to { transform: rotate(360deg); }
}

.agent-subtitle-wrapper {
  display: flex;
  align-items: center;
}

/* ── Send button sending state ──────────────────────────────── */

#send-button[disabled] {
  opacity: 0.48;
  cursor: not-allowed;
}

@keyframes blink {
  0%, 80%, 100% { transform: scale(0.8); opacity: 0.4; }
  40% { transform: scale(1); opacity: 1; }
}

@media (max-width: 1100px) {
  .agent-layout { grid-template-columns: 1fr; }
  .agent-shell { height: auto; min-height: 100vh; overflow: visible; }
  .agent-layout { overflow: visible; }
  .chat-pane { min-height: 560px; }
  .agent-header { grid-template-columns: 1fr; }
}

/* ── Message timestamp (shown on hover) ─────────────────────── */

.msg-ts {
  float: right;
  font-weight: 400;
  font-size: 11px;
  opacity: 0;
  transition: opacity 0.15s;
  margin-left: 8px;
  letter-spacing: 0;
  text-transform: none;
}

.message:hover .msg-ts {
  opacity: 0.65;
}

.message.user .msg-ts {
  color: rgba(255, 255, 255, 0.72);
}

/* ── Exception card detail fields ────────────────────────────── */

.exc-entity {
  font-weight: 600;
  margin: 6px 0 8px;
}

.exc-compare {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 8px 0;
}

.exc-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
  display: block;
  margin-bottom: 3px;
}

.exc-val {
  font-weight: 600;
  font-size: 15px;
}

.exc-excerpt {
  margin: 8px 0;
  padding: 8px 12px;
  border-left: 3px solid var(--warn);
  background: rgba(var(--accent-rgb), 0.08);
  color: var(--muted);
  font-style: italic;
  border-radius: 0 8px 8px 0;
}

.exc-source {
  font-size: 12px;
  color: var(--muted);
  margin: 2px 0 8px;
}

.exc-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: fit-content;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  margin-top: 6px;
  margin-bottom: 4px;
  border: 1px solid var(--line);
}

.exc-pill-finguard {
  color: #065f46;
  border-color: rgba(6, 95, 70, 0.32);
  background: rgba(16, 185, 129, 0.14);
}

.exc-reasoning {
  font-size: 13px;
  color: var(--muted);
  margin: 8px 0;
  padding: 8px 10px;
  background: rgba(var(--brand-rgb), 0.06);
  border-radius: 8px;
  line-height: 1.5;
}
.exc-reasoning-label {
  display: block;
  font-size: 10.5px;
  letter-spacing: .05em;
  text-transform: uppercase;
  font-weight: 700;
  color: #4F5B88;
  margin-bottom: 4px;
}
.exc-reasoning.exc-rca {
  background: rgba(250, 173, 20, .08);
}

/* Richer exception card header — title + icon + entity subtitle */
.exc-head {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 10px;
  align-items: start;
  margin-bottom: 6px;
}
.exc-head-ico {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #EEF4FF;
  border: 1px solid #CFDDFF;
  color: #0352CC;
  border-radius: 9px;
  font-size: 15px;
}
.exc-head-text {
  display: grid;
  gap: 1px;
  min-width: 0;
}
.exc-eyebrow {
  font-size: 10px;
  font-weight: 700;
  color: #0352CC;
  letter-spacing: .6px;
  text-transform: uppercase;
}
.exc-title {
  font-size: 15.5px;
  font-family: "Manrope", sans-serif;
  font-weight: 700;
  color: var(--ink);
  line-height: 1.25;
}
.exc-subtitle {
  font-size: 12.5px;
  color: var(--muted);
  font-weight: 500;
  word-break: break-word;
}

/* Purpose blurb — "A required document is missing…" */
.exc-purpose {
  font-size: 13px;
  color: var(--ink);
  line-height: 1.5;
  padding: 8px 10px;
  background: #F5F8FE;
  border: 1px solid #E3ECFB;
  border-radius: 8px;
  margin: 6px 0 6px;
}

/* "Why blocked" — prominent actionable line */
.exc-blocking {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 8px;
  align-items: baseline;
  padding: 8px 10px;
  background: #FFF4E0;
  border: 1px solid #FFD89C;
  border-radius: 8px;
  margin: 6px 0;
}
.exc-blocking-label {
  font-size: 10.5px;
  font-weight: 700;
  color: #9A5B00;
  letter-spacing: .05em;
  text-transform: uppercase;
  white-space: nowrap;
}
.exc-blocking-text {
  font-size: 13px;
  color: #5B3A00;
  line-height: 1.45;
  word-break: break-word;
}

/* Context chips — entity / field / source / severity */
.exc-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 6px 0 8px;
}
.exc-chip {
  display: inline-flex;
  align-items: stretch;
  border: 1px solid var(--line);
  background: var(--panel);
  border-radius: 999px;
  overflow: hidden;
  font-size: 11.5px;
}
.exc-chip-k {
  padding: 3px 8px;
  background: rgba(3, 82, 204, .06);
  color: var(--muted);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: 10.5px;
}
.exc-chip-v {
  padding: 3px 10px;
  color: var(--ink);
  font-weight: 600;
}
.exc-chip-bad .exc-chip-k  { background: #FDECEE; color: #B42318; }
.exc-chip-warn .exc-chip-k { background: #FFF4E0; color: #9A5B00; }
.exc-chip-info .exc-chip-k { background: #E5EEFF; color: #0352CC; }

.exc-low-confidence {
  border: 1px solid rgba(var(--brand-rgb), 0.2);
}

.exc-doc-tools {
  margin-top: 8px;
}

.exc-doc-preview {
  margin: 8px 0 0;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--panel-strong);
  color: var(--ink);
  max-height: 240px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 12px;
  line-height: 1.45;
}

/* ── Exception action hint ───────────────────────────────────── */

.exc-action-hint {
  font-size: 12px;
  color: var(--muted);
  margin-top: 10px;
  margin-bottom: 2px;
}

/* ── Exception action buttons ────────────────────────────────── */

.exc-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 12px;
}

.exc-pick {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 8px 18px;
  border-radius: var(--radius-md);
  border: 2px solid var(--ok);
  background: rgba(var(--ok-rgb), 0.08);
  color: var(--ok);
  cursor: pointer;
  transition: background 0.12s;
  min-width: 90px;
}

.exc-pick:hover {
  background: rgba(var(--ok-rgb), 0.15);
}

.exc-pick-feed {
  border-color: var(--brand);
  background: rgba(var(--brand-rgb), 0.08);
  color: var(--brand);
}

.exc-pick-feed:hover {
  background: rgba(var(--brand-rgb), 0.16);
}

.exc-pick-final {
  min-width: 220px;
  padding: 10px 22px;
  border-color: var(--ok);
  background: rgba(var(--ok-rgb), 0.12);
  color: var(--ok);
}

.exc-pick-final .exc-pick-val {
  font-size: 14px;
  letter-spacing: 0.02em;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.exc-pick-final .exc-pick-src {
  text-transform: none;
  letter-spacing: 0;
  font-size: 11px;
  opacity: 0.8;
}

.exc-pick-final:hover {
  background: rgba(var(--ok-rgb), 0.22);
}

.exc-pick-val {
  font-weight: 700;
  font-size: 16px;
  line-height: 1.2;
}

.exc-pick-src {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  opacity: 0.75;
  font-weight: 500;
}

.exc-secondary {
  padding: 8px 14px;
  border-radius: var(--radius-md);
  border: 1px solid var(--line);
  background: transparent;
  color: var(--muted);
  font-size: 13px;
  cursor: pointer;
}

.exc-secondary:hover {
  background: rgba(var(--muted-rgb), 0.12);
  color: var(--text);
}

/* ── Claims-specific gate cards ─────────────────────────────── */

.exception-card-adjuster {
  border-left: 4px solid var(--ok);
  background: rgba(var(--ok-rgb), 0.06);
}

.exception-card-nigo {
  border-left: 4px solid var(--warn);
  background: rgba(255, 165, 0, 0.06);
}

.gate-notice-adjuster {
  border-left-color: var(--ok);
}

.gate-notice-adjuster strong {
  color: var(--ok);
}

.gate-notice-nigo {
  border-left-color: #f59e0b;
}

.gate-notice-nigo strong {
  color: #b45309;
}

.exc-secondary-return {
  border-color: var(--warn);
  color: var(--warn);
}

.exc-secondary-return:hover {
  background: rgba(255, 165, 0, 0.1);
  color: var(--warn);
}

/* ── Claims Approver Modal ─────────────────────────────────── */

.claims-approver-modal {
  position: fixed;
  inset: 0;
  z-index: 70;
}

.claims-approver-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(5, 10, 28, 0.54);
}

.claims-approver-panel {
  position: absolute;
  top: 9vh;
  left: 50%;
  transform: translateX(-50%);
  width: min(760px, calc(100vw - 40px));
  max-height: 82vh;
  background: var(--panel-strong);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

.claims-approver-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
}

.claims-approver-header h2 {
  font-size: 18px;
  margin: 0;
}

#claims-approver-subtitle {
  margin: 5px 0 0;
  font-size: 12px;
  color: var(--muted);
}

.claims-approver-content {
  overflow: auto;
  padding: 14px 16px 18px;
  display: grid;
  gap: 10px;
}

.claims-approver-context-card {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--panel);
  padding: 10px 12px;
  display: grid;
  gap: 10px;
}

.claims-approver-context-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.claims-approver-context-badges {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.claims-approver-llm {
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--panel-strong);
  padding: 8px 10px;
  font-size: 12px;
  line-height: 1.45;
}

.finguard-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid rgba(var(--brand-rgb), 0.28);
  background: rgba(var(--brand-rgb), 0.08);
  color: var(--brand);
  border-radius: 999px;
  padding: 3px 10px;
  font-size: 11px;
  font-weight: 700;
}

.claims-approver-modal.is-loading .claims-approver-content {
  opacity: 0.7;
  pointer-events: none;
}

.claims-approver-modal.is-loading .claims-approver-content::before {
  content: "Applying decision...";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(var(--brand-rgb), 0.28);
  background: rgba(var(--brand-rgb), 0.1);
  color: var(--brand);
  font-size: 12px;
  font-weight: 600;
}

/* ── Entity Info Modal ─────────────────────────────────────── */

.entity-info-modal {
  position: fixed;
  inset: 0;
  z-index: 72;
}

.entity-info-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(5, 10, 28, 0.54);
}

.entity-info-panel {
  position: absolute;
  top: 7vh;
  left: 50%;
  transform: translateX(-50%);
  width: min(980px, calc(100vw - 40px));
  max-height: 86vh;
  background: var(--panel-strong);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

.entity-info-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
}

.entity-info-header h2 {
  font-size: 18px;
  margin: 0;
}

#entity-info-subtitle {
  margin: 5px 0 0;
  font-size: 12px;
  color: var(--muted);
}

.entity-info-content {
  overflow: auto;
  padding: 14px 16px 18px;
  display: grid;
  gap: 10px;
}

.entity-info-section {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--panel);
  padding: 10px 12px;
  display: grid;
  gap: 8px;
}

.entity-info-title {
  font-size: 12px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 700;
}

.entity-info-doc {
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--panel-strong);
  padding: 8px 10px;
  display: grid;
  gap: 6px;
}

.entity-info-doc pre {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  max-height: 220px;
  overflow: auto;
}

/* ── Architecture Modal ─────────────────────────────────────── */

.arch-modal {
  position: fixed;
  inset: 0;
  z-index: 50;
}

.arch-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(5, 10, 28, 0.48);
}

.arch-panel {
  position: absolute;
  top: 8vh;
  right: 24px;
  width: min(760px, calc(100vw - 48px));
  max-height: 84vh;
  background: var(--panel-strong);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

.arch-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
}

.arch-header h2 {
  font-size: 16px;
}

.arch-header-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.arch-content {
  padding: 14px 16px 18px;
  overflow: auto;
  display: grid;
  gap: 12px;
}

.arch-section {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--panel);
  padding: 10px 12px;
  display: grid;
  gap: 8px;
}

.arch-section-title {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted);
}

.arch-path {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.arch-node {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 4px 8px;
  font-size: 12px;
  background: var(--panel-strong);
}

.arch-node.pass {
  border-color: rgba(var(--ok-rgb), 0.45);
  background: rgba(var(--ok-rgb), 0.12);
  color: var(--ok);
}

.arch-node.current {
  border-color: rgba(var(--brand-rgb), 0.45);
  background: rgba(var(--brand-rgb), 0.12);
  color: var(--brand);
}

.arch-node.fail {
  border-color: rgba(180, 35, 24, 0.45);
  background: rgba(180, 35, 24, 0.12);
  color: #b42318;
}

.arch-arrow {
  color: var(--muted);
  font-size: 12px;
}

.arch-list {
  display: grid;
  gap: 6px;
}

.arch-list-row {
  font-size: 12px;
  padding: 6px 8px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--line);
  background: var(--panel-strong);
}

.arch-list-row.fail {
  border-color: rgba(180, 35, 24, 0.45);
  background: rgba(180, 35, 24, 0.1);
}

.arch-diagram-toolbar {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.arch-mermaid {
  min-width: 880px;
  width: fit-content;
  padding: 8px;
}

.arch-mermaid-shell {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--panel-strong);
  min-height: 360px;
  max-height: 62vh;
  overflow: auto;
  position: relative;
}

.arch-mermaid-canvas {
  transform-origin: 0 0;
}

.arch-mermaid-shell:fullscreen {
  background: var(--panel-strong);
  padding: 12px;
  max-height: none;
}

.arch-mermaid svg {
  max-width: none;
  height: auto;
  text-rendering: geometricPrecision;
  shape-rendering: geometricPrecision;
  image-rendering: auto;
}

.arch-diagram {
  display: grid;
  gap: 10px;
}

.arch-flow-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.arch-box {
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 5px 8px;
  font-size: 12px;
  background: var(--panel-strong);
}

.arch-subgrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.arch-subcard {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--panel-strong);
  padding: 8px 10px;
  display: grid;
  gap: 6px;
}

.arch-subtitle {
  font-size: 12px;
  font-weight: 700;
  color: var(--text);
}

.arch-subline {
  font-size: 12px;
  color: var(--muted);
}

.arch-tag {
  display: inline-flex;
  align-items: center;
  border-radius: var(--radius-sm);
  border: 1px solid var(--line);
  padding: 1px 6px;
  font-size: 11px;
  line-height: 1.2;
  margin-right: 4px;
}

.arch-tag.ok {
  color: var(--ok);
  border-color: rgba(var(--ok-rgb), 0.4);
  background: rgba(var(--ok-rgb), 0.12);
}

.arch-tag.warn {
  color: var(--warn);
  border-color: rgba(var(--accent-rgb), 0.45);
  background: rgba(var(--accent-rgb), 0.12);
}

.arch-tag.bad {
  color: #b42318;
  border-color: rgba(180, 35, 24, 0.45);
  background: rgba(180, 35, 24, 0.12);
}

.arch-tag.info {
  color: var(--brand);
  border-color: rgba(var(--brand-rgb), 0.45);
  background: rgba(var(--brand-rgb), 0.12);
}

.arch-tag.muted {
  color: var(--muted);
  border-color: rgba(var(--muted-rgb), 0.45);
  background: rgba(var(--muted-rgb), 0.12);
}

/* ── Dashboard Modal ───────────────────────────────────────── */

.dashboard-modal {
  position: fixed;
  inset: 0;
  z-index: 260;
}

.dashboard-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(5, 10, 28, 0.58);
}

.dashboard-panel {
  position: absolute;
  top: 3vh;
  left: 50%;
  transform: translateX(-50%);
  width: min(1360px, calc(100vw - 30px));
  max-height: 94vh;
  background: var(--panel-strong);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: 0 20px 56px rgba(10, 24, 48, 0.28);
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

.dashboard-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
  background: var(--panel);
}

.dashboard-header h2 {
  margin: 0;
  color: var(--ink);
  font-family: 'Manrope', 'Avenir Next', sans-serif;
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.02em;
}

#dashboard-subtitle {
  margin: 6px 0 0;
  font-size: 13px;
  color: var(--muted);
}

.dashboard-header-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.dashboard-content {
  overflow: auto;
  padding: 14px;
}

.dashboard-shell {
  display: grid;
  gap: 12px;
}

.dashboard-toggle {
  display: inline-flex;
  gap: 6px;
  padding: 4px;
  border-radius: 999px;
  background: rgba(var(--brand-rgb), 0.08);
  border: 1px solid var(--line);
  width: fit-content;
}

.dashboard-toggle-btn {
  border: 0;
  border-radius: 999px;
  padding: 7px 14px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
  background: transparent;
  cursor: pointer;
}

.dashboard-toggle-btn.is-active {
  background: var(--brand);
  color: #fff;
}

.dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(300px, 1fr);
  gap: 12px;
}

.dash-board {
  border: 1px solid var(--line);
  background: var(--panel);
}

.dash-board-header {
  background: var(--ink);
  color: #fff;
  padding: 14px 14px 12px;
  font-size: 29px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.dash-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  gap: 10px;
  padding: 10px;
}

.dash-metric {
  border: 1px solid var(--line);
  background: var(--panel-strong);
  border-radius: 4px;
  padding: 10px 8px;
  text-align: center;
}

.dash-metric-value {
  font-size: 40px;
  line-height: 1;
  font-weight: 800;
}

.dash-metric-label {
  margin-top: 8px;
  font-size: 18px;
  color: var(--muted);
}

.dash-metric.blue .dash-metric-value { color: var(--brand); }
.dash-metric.green .dash-metric-value { color: var(--ok); }
.dash-metric.amber .dash-metric-value { color: var(--warn); }
.dash-metric.red .dash-metric-value { color: #b42318; }
.dash-metric.purple .dash-metric-value { color: var(--ink); }

.dash-rows {
  display: grid;
  gap: 8px;
  padding: 0 10px 10px;
}

.dash-row {
  background: var(--panel-strong);
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 10px;
  display: grid;
  grid-template-columns: minmax(150px, 1.2fr) minmax(120px, 1fr) minmax(140px, 1fr) minmax(120px, 0.95fr) minmax(110px, 0.9fr);
  align-items: center;
  gap: 10px;
}

.dash-row-id {
  font-weight: 700;
  color: var(--ink);
}

.dash-row-kind,
.dash-row-name,
.dash-row-note {
  color: var(--text);
}

.dash-status {
  justify-self: stretch;
  text-align: center;
  border: 1px solid;
  border-radius: 3px;
  font-weight: 800;
  font-size: 13px;
  letter-spacing: 0.02em;
  padding: 7px 6px;
}

.dash-status.green {
  border-color: rgba(var(--ok-rgb), 0.4);
  background: rgba(var(--ok-rgb), 0.12);
  color: var(--ok);
}

.dash-status.amber {
  border-color: rgba(var(--accent-rgb), 0.45);
  background: rgba(var(--accent-rgb), 0.12);
  color: #8a5208;
}

.dash-status.red {
  border-color: rgba(180, 35, 24, 0.45);
  background: rgba(180, 35, 24, 0.11);
  color: #b42318;
}

.dash-status.blue {
  border-color: rgba(var(--brand-rgb), 0.45);
  background: rgba(var(--brand-rgb), 0.12);
  color: var(--brand);
}

.dash-status.slate {
  border-color: rgba(var(--muted-rgb), 0.35);
  background: rgba(var(--muted-rgb), 0.1);
  color: var(--muted);
}

.dash-note-col {
  display: grid;
  gap: 2px;
}

.dash-note-main {
  color: var(--text);
  font-size: 12px;
}

.dash-note-time {
  color: var(--muted);
  font-size: 11px;
}

.dash-notify {
  border: 1px solid var(--line);
  background: var(--panel);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

.dash-notify-header {
  background: var(--ok);
  color: #fff;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 13px 14px;
}

.dash-notify-list {
  padding: 10px;
  display: grid;
  gap: 9px;
  align-content: start;
}

.dash-notify-item {
  border: 1px solid var(--line);
  border-left: 6px solid rgba(var(--brand-rgb), 0.6);
  background: var(--panel-strong);
  padding: 10px 12px;
  display: grid;
  gap: 5px;
}

.dash-notify-item.green {
  border-left-color: rgba(var(--ok-rgb), 0.9);
  background: rgba(var(--ok-rgb), 0.08);
}

.dash-notify-item.amber {
  border-left-color: rgba(var(--accent-rgb), 0.9);
  background: rgba(var(--accent-rgb), 0.08);
}

.dash-notify-item.red {
  border-left-color: rgba(180, 35, 24, 0.88);
  background: rgba(180, 35, 24, 0.08);
}

.dash-notify-item.blue {
  border-left-color: rgba(var(--brand-rgb), 0.88);
  background: rgba(var(--brand-rgb), 0.08);
}

.dash-notify-title {
  font-size: 14px;
  font-weight: 800;
  color: var(--ink);
}

.dash-notify-message {
  font-size: 13px;
  color: var(--text);
}

.dash-notify-time {
  font-size: 11px;
  color: var(--muted);
}

.dash-empty {
  border: 1px dashed rgba(var(--muted-rgb), 0.4);
  border-radius: 6px;
  background: var(--panel-strong);
  color: var(--muted);
  font-size: 13px;
  padding: 14px;
}

/* ── Floating Adjudicator Approval Gate ─────────────────────────
   Lives inside the .chat-pane grid as a sibling row above the
   composer. The gate component (.adj-gate) is moved into this host
   by adjudication.js when a decision is awaited; the host stays
   `hidden` otherwise so there's no placeholder gap. */
.adj-gate-host {
  margin: 8px 14px 0;
  animation: adjGateSlideIn .22s ease both;
}
.adj-gate-host[hidden] { display: none; }
.adj-gate-host .adj-gate-floating {
  margin-top: 0;
  /* Reuse the same border/shadow language as the surrounding panels
     so the gate looks like a native chat-column card. */
  box-shadow: 0 6px 18px rgba(0, 10, 98, 0.10);
  padding: 16px 18px;
}
.adj-gate-host .adj-gate-floating .adj-gate-title { font-size: 13px; }
.adj-gate-host .adj-gate-floating .adj-gate-desc  { font-size: 12px; margin-bottom: 12px; }
.adj-gate-host .adj-gate-floating .adj-gate-btn   { font-size: 12px; padding: 9px 14px; }
.adj-gate-host .adj-gate-floating .adj-gate-status { font-size: 11.5px; margin-top: 12px; }
@keyframes adjGateSlideIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Processing overlay (post-Approve, pre-summary) ────────────
   Centered, non-dismissable, matches run-summary-modal backdrop
   so it feels like the same family of dialogs. */
.adj-processing-overlay {
  position: fixed;
  inset: 0;
  z-index: 70; /* above run-summary (60) so it can sit on top during fetch */
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: auto;
}
.adj-processing-overlay.hidden { display: none; }
.adj-processing-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(5, 10, 28, 0.54);
  backdrop-filter: saturate(140%) blur(2px);
  -webkit-backdrop-filter: saturate(140%) blur(2px);
}
.adj-processing-card {
  position: relative;
  background: var(--panel-strong);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 22px 28px;
  min-width: 280px;
  max-width: 360px;
  text-align: center;
  display: grid;
  gap: 10px;
  justify-items: center;
  font-family: inherit;
  animation: adjProcessingPop .18s ease both;
}
@keyframes adjProcessingPop {
  from { opacity: 0; transform: scale(.96); }
  to   { opacity: 1; transform: scale(1); }
}
.adj-processing-spinner {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 3px solid rgba(0, 10, 98, 0.10);
  border-top-color: #6B86FF;
  animation: adjProcessingSpin .9s linear infinite;
}
@keyframes adjProcessingSpin {
  to { transform: rotate(360deg); }
}
.adj-processing-title {
  font-family: "Manrope", sans-serif;
  font-size: 15px;
  font-weight: 700;
  color: var(--ink);
}
.adj-processing-sub {
  font-size: 12.5px;
  color: var(--muted);
  line-height: 1.5;
}

/* ── Run Summary Modal ──────────────────────────────────────── */

.run-summary-modal {
  position: fixed;
  inset: 0;
  z-index: 60;
}

.run-summary-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(5, 10, 28, 0.54);
}

.run-summary-panel {
  position: absolute;
  top: 6vh;
  left: 50%;
  transform: translateX(-50%);
  width: min(980px, calc(100vw - 40px));
  max-height: 88vh;
  background: var(--panel-strong);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

.run-summary-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
}

.run-summary-header h2 {
  font-size: 18px;
  margin: 0;
}

#run-summary-subtitle {
  margin: 5px 0 0;
  font-size: 12px;
  color: var(--muted);
}

.run-summary-actions {
  display: inline-flex;
  gap: 8px;
  align-items: center;
}

.run-summary-content {
  overflow: auto;
  padding: 14px 16px 18px;
  display: grid;
  gap: 12px;
}

.run-modal-meta-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
}

.run-modal-meta {
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--panel);
  padding: 9px 10px;
}

.run-modal-meta-label {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.run-modal-meta-value {
  margin-top: 4px;
  font-size: 13px;
  color: var(--ink);
  font-weight: 600;
  word-break: break-word;
}

.run-modal-section {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--panel);
  padding: 10px 12px;
  display: grid;
  gap: 8px;
}

.run-modal-title {
  font-size: 12px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 700;
}

/* Collapsible section (e.g. Agent Outcomes — verbose, useful only when
   a reviewer wants the per-agent breakdown). Uses native <details> so
   no JS is needed to toggle. The chevron rotates on open. */
.run-modal-collapsible {
  display: grid;
  gap: 8px;
}
.run-modal-collapsible > .run-modal-collapsible-summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 10px;
  user-select: none;
}
.run-modal-collapsible > .run-modal-collapsible-summary::-webkit-details-marker {
  display: none;
}
.run-modal-collapsible-meta {
  font-size: 11px;
  color: var(--muted);
  font-weight: 600;
  letter-spacing: .02em;
}
.run-modal-collapsible-chev {
  margin-left: auto;
  font-size: 11px;
  color: var(--muted);
  transition: transform .15s ease;
}
.run-modal-collapsible[open] .run-modal-collapsible-chev {
  transform: rotate(180deg);
}

.run-tool-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 8px;
}

.run-tool-card {
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--panel-strong);
  padding: 9px 10px;
  display: grid;
  gap: 4px;
}

.run-tool-name {
  font-weight: 700;
  font-size: 13px;
  color: var(--ink);
}

.run-tool-meta {
  font-size: 12px;
  color: var(--muted);
}

.run-human-list {
  display: grid;
  gap: 8px;
}

.run-human-item {
  border: 1px solid var(--line);
  border-left: 3px solid var(--warn);
  border-radius: var(--radius-sm);
  background: var(--panel-strong);
  padding: 8px 10px;
  display: grid;
  gap: 3px;
}

.run-human-item strong {
  font-size: 13px;
  color: var(--ink);
}

.run-human-item span {
  font-size: 12px;
  color: var(--muted);
}

.run-empty {
  font-size: 13px;
  color: var(--muted);
}

.run-llm-summary {
  font-size: 13px;
  line-height: 1.5;
  color: var(--ink);
}

.run-llm-summary p {
  margin: 0 0 0.65em;
}

.run-llm-summary p:last-child {
  margin-bottom: 0;
}

.adjudication-package {
  display: grid;
  gap: 10px;
}

.adjudication-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
}

.adjudication-claim-id {
  margin-top: 4px;
  font-size: 12px;
  color: var(--muted);
}

.adjudication-recommendation {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 5px 12px;
  border: 1px solid var(--line);
  font-size: 12px;
  font-weight: 700;
}

.adjudication-recommendation.is-pass {
  border-color: rgba(var(--ok-rgb), 0.35);
  background: rgba(var(--ok-rgb), 0.1);
  color: var(--ok);
}

.adjudication-recommendation.is-warn {
  border-color: rgba(var(--accent-rgb), 0.35);
  background: rgba(var(--accent-rgb), 0.1);
  color: #92400e;
}

.adjudication-recommendation.is-fail {
  border-color: rgba(180, 35, 24, 0.35);
  background: rgba(180, 35, 24, 0.1);
  color: #b42318;
}

.adjudication-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(130px, 1fr));
  gap: 8px;
}

.adjudication-kpi {
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 8px;
  background: var(--panel-strong);
}

.kpi-value {
  font-size: 20px;
  font-weight: 700;
  color: var(--ink);
}

.kpi-label {
  margin-top: 2px;
  font-size: 11px;
  color: var(--muted);
}

.adjudication-rationale {
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 8px;
  background: var(--panel-strong);
  font-size: 12px;
  line-height: 1.5;
}

.adjudication-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 8px;
}

.adjudication-row {
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 8px;
  background: var(--panel-strong);
  display: grid;
  gap: 4px;
}

.adjudication-row span {
  font-size: 11px;
  color: var(--muted);
}

.adjudication-row strong {
  font-size: 13px;
}

@media (max-width: 900px) {
  .arch-subgrid {
    grid-template-columns: 1fr;
  }
  .dashboard-panel {
    top: 2vh;
    width: min(1360px, calc(100vw - 14px));
    max-height: 96vh;
  }
  .dashboard-header h2 {
    font-size: 22px;
  }
  .dashboard-grid {
    grid-template-columns: 1fr;
  }
  .dash-metrics {
    grid-template-columns: repeat(2, minmax(120px, 1fr));
  }
  .dash-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .dash-status {
    justify-self: start;
    min-width: 150px;
  }
  .run-summary-panel {
    width: min(980px, calc(100vw - 20px));
    top: 3vh;
    max-height: 93vh;
  }
  .run-summary-header {
    flex-direction: column;
    align-items: stretch;
  }
  .run-summary-actions {
    justify-content: flex-end;
  }
}

/* ═══════════════════════════════════════════════════════════════
   AGENT PAGE — DESIGN SYSTEM OVERRIDES
   Aligns the agent page with the landing page visual language:
   same fonts (Manrope + Inter), colors (#00003c / #585f6a /
   #266bf6), white card panels, and consistent spacing.
═══════════════════════════════════════════════════════════════ */

/* ─── Body: flex column so sticky nav + shell fill 100vh ─── */
body {
  font-family: 'Inter', 'Avenir Next', 'Segoe UI', sans-serif;
  font-size: 13px;
  display: flex;
  flex-direction: column;
  height: 100vh;
  overflow: hidden;
  /* Override base.css gradient — match landing page flat bg */
  background: #f8f9ff;
  background-image: none;
}

/* ─── Top navigation bar (same as landing page) ─── */
.top-nav {
  background: #ffffff;
  border-bottom: 1px solid #b6b6b6;
  box-shadow: 0 4px 20px rgba(0, 0, 128, 0.05);
  position: sticky;
  top: 0;
  z-index: 200;
  flex-shrink: 0;
}

.top-nav-inner {
  max-width: none;
  width: 100%;
  margin: 0;
  padding: 0 24px;
  height: 56px;
  display: flex;
  align-items: center;
}

.top-nav-brand {
  display: flex;
  align-items: center;
  gap: 10px;
}

.nav-logo {
  width: 40px;
  height: 40px;
  border-radius: 4px;
  object-fit: cover;
  display: block;
}

/* Manrope Bold — matches landing page nav title */
.nav-title {
  font-family: 'Manrope', 'Avenir Next', sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #1e3a8a;
  letter-spacing: -0.5px;
}

/* ─── Agent shell: fills remaining height under the nav ─── */
/* Override the original height: 100vh so the layout accounts
   for the sticky nav without causing overflow. */
.agent-shell {
  flex: 1;
  width: 100%;
  margin: 0;
  min-height: 0;
  height: auto;           /* cancels the original height: 100vh */
  padding: 12px 16px 14px;
  background: transparent;
}

/* ─── Agent header: white card matching landing page panels ─── */
.agent-header {
  background: #ffffff;
  border: 1px solid #eff6ff;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 128, 0.05);
  /* Trimmed ~1-2% off vertical padding (10px → 9px) and the bottom
     margin (12px → 10px). A few pixels back to the chat stream
     without changing typography or icon sizing. */
  padding: 9px 20px;
  margin-bottom: 10px;
  /* Two columns: left cluster (title, badge, Run Now) | right cluster (actions, status) */
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
}

/* Back link — muted, Inter medium */
.back-link {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: #585f6a;
  text-decoration: none;
  transition: color 0.15s;
}
.back-link:hover { color: #266bf6; }
/* Larger, pill-style back button used in the chat header. Matches the
   visual weight of Run Now so it's an obvious escape hatch. */
.back-link-lg {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 38px;
  padding: 0 16px;
  font-size: 13.5px;
  font-weight: 600;
  color: #0f172a;
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  border-radius: 999px;
  transition: background 120ms ease, border-color 120ms ease, color 120ms ease, transform 80ms ease;
}
.back-link-lg i {
  font-size: 12px;
  opacity: 0.85;
}
.back-link-lg:hover {
  background: #e2e8f0;
  border-color: #94a3b8;
  color: #0b1f3f;
}
.back-link-lg:active {
  transform: translateY(1px);
}

/* Agent icon box — same container style as landing page .agent-icon */
#agent-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 10px;
  background: #e5eeff;
  flex-shrink: 0;
  /* Hide the emoji set by JS — image shown via background-image below */
  font-size: 0;
  color: transparent;
  background-repeat: no-repeat;
  background-position: center;
}

/* ─── Per-agent icon images matching the landing page cards exactly ───
   body[data-agent] is set by the inline script in agent.html which reads
   location.pathname — no logic change, purely a CSS targeting hook.     ─── */
body[data-agent="loanops"] #agent-icon {
  background-image: url('/static/img/Loan.png');
  background-size: 28px;
}
body[data-agent="claims"] #agent-icon {
  background-image: url('/static/img/Claims.svg');
  background-size: 22px;
}
body[data-agent="finguard"] #agent-icon {
  background-image: url('/static/img/FinGurd.svg');
  background-size: 22px;
}

/* Agent name — Manrope Bold matching landing page h2 */
.agent-title h1 {
  font-family: 'Manrope', 'Avenir Next', sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: #00003c;
  letter-spacing: -0.4px;
  line-height: 1.2;
}

/* Agent subtitle — Inter muted */
#agent-subtitle {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  color: #585f6a;
  margin-top: 2px;
}

/* Status pill — tighter, matches landing page badge style */
.agent-status {
  background: #f0fdf4;
  border: 1px solid rgba(34, 197, 94, 0.3);
  padding: 6px 14px;
  border-radius: 9999px;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 500;
}

/* Header action buttons — consistent ghost style */
.agent-header-actions {
  gap: 8px;
}

/* ─── Two-row claim-summary header card (mock-matching navy) ─── */
.agent-header-claim {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin-bottom: 12px;
  display: block !important;
}
.agent-header-claim .ah-card {
  position: relative;
  border-radius: 14px;
  padding: 14px 28px 0;
  color: #ffffff;
  /* Solid deep navy matching the reference mock */
  background: #0d3b8a;
  box-shadow: 0 8px 24px rgba(13, 59, 138, 0.22), inset 0 0 0 1px rgba(255,255,255,0.05);
  min-height: 8vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* Two stacked rows of content + footer at the bottom */
.ah-row {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}
.ah-row-top {
  padding-bottom: 10px;
  justify-content: space-between;
}
.ah-row-body {
  flex: 1 1 auto;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 14px;
  gap: 24px;
}

.ah-brand {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
}
.ah-brand-logo {
  width: 38px;
  height: 38px;
  border-radius: 6px;
  object-fit: cover;
  display: block;
  background: #ffffff;
  padding: 3px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

.ah-back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 38px;
  padding: 0 16px;
  border-radius: 999px;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.20);
  color: #e6efff;
  text-decoration: none;
  font-size: 13.5px;
  font-weight: 600;
  flex-shrink: 0;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.ah-back:hover {
  background: rgba(255,255,255,0.18);
  border-color: rgba(255,255,255,0.34);
  color: #ffffff;
}
.ah-back i { font-size: 12px; }

/* Chat header title in the ah-card top row. Sits immediately after the
   Back-to-Dashboard pill so reviewers always know which adjudicator chat
   they're inside; the claim-number badge floats to the right via
   margin-left:auto. */
.ah-chat-title {
  margin: 0;
  margin-right: auto;
  font-family: "Sora", "Manrope", "Inter", sans-serif;
  font-weight: 700;
  font-size: 17px;
  letter-spacing: 0.2px;
  color: #ffffff;
}

/* Right-side actions on the top row */
.ah-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  flex-shrink: 0;
  margin-left: auto;
}

.ah-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid transparent;
  text-decoration: none;
  white-space: nowrap;
  transition: background .15s ease, border-color .15s ease, color .15s ease, transform .08s ease, box-shadow .15s ease;
}
.ah-btn[hidden] { display: none !important; }
.ah-btn i { font-size: 11px; }
.ah-btn-primary {
  background: linear-gradient(180deg, #2f7bff, #0f5bd9);
  color: #ffffff;
  border-color: rgba(255,255,255,0.25);
  box-shadow: 0 2px 8px rgba(15, 91, 217, 0.45), inset 0 1px 0 rgba(255,255,255,0.18);
}
.ah-btn-primary:hover { filter: brightness(1.06); transform: translateY(-1px); }
.ah-btn-primary:disabled { opacity: .7; cursor: progress; transform: none; }
/* Run Now once a run has been launched for this claim — blurred and
   unclickable. Single source of truth lives here; the button stays
   visible so reviewers can see the action existed, but it can't be
   triggered a second time. A fresh run requires re-uploading from
   the dashboard. */
.ah-btn-primary.is-spent {
  filter: blur(1.4px) grayscale(.4);
  opacity: .55;
  pointer-events: none;
  cursor: not-allowed;
}
.ah-btn-ghost {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.20);
  color: #e6efff;
}
.ah-btn-ghost:hover {
  background: rgba(255,255,255,0.16);
  border-color: rgba(255,255,255,0.34);
  color: #ffffff;
}

/* Default (non-escalated) claim-summary button: painted in a bright
   amber/gold gradient so it visibly differs from the surrounding ghost
   pills (View Inputs, Run Now, Audit Trail) and reads as the primary
   "open the result" CTA. ID selector is used to beat the existing
   `.ah-card .ah-btn` ghost styling at higher specificity. The
   `.ah-btn-escalated` rule below overrides this when SIU lands. */
button#claim-summary-button,
.ah-card button#claim-summary-button {
  background: linear-gradient(180deg, #fbbf24, #d97706) !important;
  border-color: #b45309 !important;
  color: #1f2937 !important;
  font-weight: 700 !important;
  box-shadow: 0 0 0 1px rgba(253, 224, 71, 0.45), 0 6px 18px rgba(217, 119, 6, 0.30) !important;
}
button#claim-summary-button:hover,
.ah-card button#claim-summary-button:hover {
  background: linear-gradient(180deg, #f59e0b, #b45309) !important;
  border-color: #92400e !important;
  color: #111827 !important;
}
button#claim-summary-button i,
button#claim-summary-button span { color: inherit !important; }

/* Escalated-to-SIU treatment for the claim-summary button. Painted red
   instead of the default ghost so the final-outcome CTA stands out the
   moment a quarantined claim lands. Class is toggled by
   _setClaimSummaryButtonEscalated in chat.js. ID selector is used to
   beat the existing `.ah-card .ah-btn` rule that ships the ghost
   styling at higher specificity. */
button#claim-summary-button.ah-btn-escalated,
.ah-card button#claim-summary-button.ah-btn-escalated {
  background: linear-gradient(180deg, #ef4444, #b91c1c) !important;
  border-color: #b91c1c !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  box-shadow: 0 0 0 1px rgba(248, 113, 113, 0.55), 0 6px 18px rgba(220, 38, 38, 0.32) !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
}
button#claim-summary-button.ah-btn-escalated:hover,
.ah-card button#claim-summary-button.ah-btn-escalated:hover {
  background: linear-gradient(180deg, #dc2626, #991b1b) !important;
  border-color: #991b1b !important;
  color: #ffffff !important;
}
button#claim-summary-button.ah-btn-escalated i,
button#claim-summary-button.ah-btn-escalated span { color: #ffffff !important; }

/* Override legacy #architecture-button + #scan-feed-button rules that have
   ID-level specificity. Inside the new claim-summary card, these buttons
   must look identical to the other ghost pills. */
.ah-card .ah-btn,
.ah-card #architecture-button,
.ah-card #scan-feed-button {
  font-family: inherit;
  font-size: 12.5px;
  font-weight: 600;
  height: 34px;
  padding: 0 14px;
  border-radius: 999px;
}
.ah-card #architecture-button,
.ah-card #scan-feed-button {
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.20);
  color: #e6efff;
}
.ah-card #architecture-button:hover,
.ah-card #scan-feed-button:hover {
  background: rgba(255,255,255,0.16);
  border-color: rgba(255,255,255,0.34);
  color: #ffffff;
}

.ah-status {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.20);
  color: #e6efff;
  font-size: 12.5px;
  font-weight: 600;
}
.ah-status .status-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #34d399;
  box-shadow: 0 0 0 3px rgba(52, 211, 153, 0.18);
}

/* Bottom row: avatar + value + claimant on the left, claim number on the right */
.ah-info {
  display: inline-flex;
  align-items: center;
  gap: 22px;
  min-width: 0;
  flex: 1 1 auto;
}
.ah-avatar {
  width: 56px;
  height: 56px;
  border-radius: 999px;
  background: linear-gradient(180deg, #b9d2ff, #7ea7ff);
  color: #0a2a6b;
  font-family: 'Manrope', 'Avenir Next', sans-serif;
  font-weight: 800;
  font-size: 18px;
  letter-spacing: .4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid rgba(255,255,255,0.22);
  flex-shrink: 0;
}
.ah-info-block {
  display: inline-flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.ah-info-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: #9bb6ec;
}
.ah-info-divider {
  width: 1px;
  height: 48px;
  background: rgba(255,255,255,0.18);
  flex-shrink: 0;
}
.ah-hero-value {
  font-family: 'Manrope', 'Avenir Next', sans-serif;
  font-size: 36px;
  font-weight: 800;
  line-height: 1.05;
  color: #ffffff;
  letter-spacing: -0.6px;
}
/* Pending state — shown before extraction has produced a real claim_amount.
   Smaller, lighter, italicized so it doesn't compete with the eventual
   bold dollar figure once the value arrives. */
.ah-hero-value.ah-hero-value-pending {
  font-size: 18px;
  font-weight: 600;
  font-style: italic;
  letter-spacing: 0;
  color: rgba(255, 255, 255, 0.72);
}
.ah-claimant-name {
  font-family: 'Manrope', 'Avenir Next', sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.2;
  color: #ffffff;
}
/* Row that holds the claimant name + the inline View Inputs button. */
.ah-claimant-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
/* Inline (smaller) variant of .ah-btn used inside the claimant info block.
   Keeps the button visually subordinate to the claimant name itself. */
.ah-btn-inline {
  font-size: 11.5px;
  padding: 4px 10px;
  height: 28px;
  font-weight: 600;
  border-radius: 6px;
}
.ah-btn-inline i { font-size: 11px; }

/* Claim-number block on the top-right */
.ah-claim-number {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.ah-claim-number[hidden] { display: none; }
.ah-claim-number-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: #9bb6ec;
}
.ah-claim-number-label i { font-size: 11px; color: #9bb6ec; }
.ah-claim-number-id {
  font-family: 'JetBrains Mono', 'SF Mono', Menlo, monospace;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .4px;
  color: #cfdcf6;
  background: rgba(255, 255, 255, 0.10);
  padding: 3px 8px;
  border-radius: 5px;
}

/* Claim-number rendered inside the footer strip: pinned to the right edge
   via absolute positioning so it doesn't shift the centered claim-type. */
.ah-foot { position: relative; }
.ah-foot .ah-claim-number {
  position: absolute;
  right: 28px;
  top: 50%;
  transform: translateY(-50%);
}
.ah-foot .ah-claim-number-id { font-size: 13px; }
/* Header footer strip — claim type as a prominent banner. */
.ah-foot {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
  margin: 0 -28px;
  padding: 12px 28px;
  background: rgba(255,255,255,0.08);
  border-top: 1px solid rgba(255,255,255,0.10);
  color: #ffffff;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: .3px;
}
.ahf-item {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.ahf-item i { color: #9bb6ec; font-size: 16px; }
#claim-summary-type {
  font-family: "Sora", "Manrope", "Inter", sans-serif;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: .3px;
  text-transform: capitalize;
}

@media (max-width: 920px) {
  .ah-row { gap: 12px; }
  .ah-row-body { padding-left: 0; align-items: flex-start; }
  .ah-actions { margin-left: 0; }
  .ah-info-divider { display: none; }
  .ah-hero-value { font-size: 28px; }
}

.chat-action-btn,
#architecture-button {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 500;
  height: 32px;
  padding: 0 14px;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  color: #585f6a;
  background: #ffffff;
  transition: border-color 0.15s, background 0.15s, color 0.15s;
}
.chat-action-btn:hover,
#architecture-button:hover {
  border-color: #266bf6;
  color: #266bf6;
  background: rgba(38, 107, 246, 0.04);
}

#scan-feed-button {
  height: 32px;
  padding: 0 14px;
  border-radius: 8px;
  border: none;
  background: #266bf6;
  color: #ffffff;
  font-size: 12px;
  font-weight: 500;
}

#scan-feed-button:hover {
  background: #1a5ce0;
  color: #ffffff;
  border: none;
}

/* ─── Layout gap ─── */
.agent-layout {
  gap: 12px;
  /* smooth transition when tools pane collapses */
  transition: grid-template-columns 0.28s ease;
}

/* ─── Panels: white cards matching landing page ─── */
.chat-pane,
.tools-pane,
.trail-pane {
  background: #ffffff;
  border: 1px solid #eff6ff;
  border-radius: 12px;
  box-shadow: 0 2px 10px rgba(0, 0, 128, 0.05);
}

/* Chat stream slight padding fix */
.chat-stream {
  padding: 16px;
}

/* ═══════════════════════════════════════════════════════════════
   COMPACT CHAT INPUT AREA
   Goals:
   - Flex row: [📎 btn] [textarea flex-1] [Send btn]
   - Textarea min-height = Send button height (40px) → perfect alignment
   - 15px top padding = visible gap between message list and input zone
   - Tight composer-actions row below
═══════════════════════════════════════════════════════════════ */

/* Overrides original display:grid — flex gives easier 3-col alignment */
.composer {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  /* 15px padding-top = required margin between message list and input */
  padding: 15px 16px 10px;
  border-top: 1px solid #f1f5f9;
  background: linear-gradient(180deg, rgba(255,255,255,0.82), #ffffff);
}

/* ─── Textarea — reduced height, flex-grow to fill space ─── */
.composer textarea {
  flex: 1;
  min-width: 0;
  resize: none;
  /* Reduced from 52px → 40px; matches Send button height */
  min-height: 40px;
  max-height: 120px;
  padding: 10px 12px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  line-height: 1.4;
  color: #00003c;
  background: #fafbff;
}
.composer textarea:focus {
  outline: none;
  border-color: #266bf6;
  box-shadow: 0 0 0 3px rgba(38, 107, 246, 0.1);
}

/* ─── Send button — same height as textarea for clean alignment ─── */
#send-button {
  height: 40px;          /* proportional to textarea min-height */
  padding: 0 18px;
  font-size: 13px;
  font-weight: 600;
  background: #266bf6;
  color: #ffffff;
  border-radius: 8px;
  font-family: 'Inter', sans-serif;
  transition: background 0.15s;
  flex-shrink: 0;
  white-space: nowrap;
  border: none;
}
#send-button:hover { background: #1a5ce0; }

/* ─── Composer actions row — compact ─── */
.composer-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 16px 10px;  /* tight top + bottom, no wasted space */
  background: #ffffff;
  flex-wrap: nowrap;
}

/* ─── Action buttons — compact pill style ─── */
.chat-action-btn {
  height: 28px;
  border-radius: 6px;
  border: 1px solid #e2e8f0;
  padding: 0 10px;
  font-size: 11px;
  font-weight: 500;
  font-family: 'Inter', sans-serif;
  color: #585f6a;
  background: #ffffff;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  transition: border-color 0.15s, color 0.15s, background 0.15s;
  white-space: nowrap;
}
.chat-action-btn:hover {
  border-color: #266bf6;
  color: #266bf6;
  background: rgba(38, 107, 246, 0.04);
}

/* Trail header padding tightened */
.trail-header {
  padding: 14px 16px 10px;
}

/* Trail pane title */
.trail-pane .pane-title {
  font-family: 'Manrope', 'Avenir Next', sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: #00003c;
}

/* Trail controls: hamburger button + dropdown — equal height, consistent look */
#toggle-trail {
  /* Match the select's rendered height exactly */
  height: 30px;
  padding: 0 10px;
  font-size: 16px;
  line-height: 1;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Trail filter select — same height as the hamburger, extra right padding for arrow */
.trail-controls select {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  color: #585f6a;
  border-color: #e2e8f0;
  border-radius: 6px;
  /* top/bottom padding drives height — matches #toggle-trail 30px */
  height: 30px;
  padding: 0 28px 0 10px;   /* 28px right = space between text and native ▾ arrow */
  background: #fafbff;
  box-sizing: border-box;
}

/* ═══════════════════════════════════════════════════════════════
   TOOLS PANE — COLLAPSE MECHANISM (CSS-only checkbox hack)

   Structure:
     <input type="checkbox" id="tools-collapse-toggle" />  ← sibling of .agent-layout
     <section class="agent-layout">
       <aside class="tools-pane">
         <div class="pane-header">
           <div class="pane-title">…</div>
           <label for="tools-collapse-toggle">‹</label>  ← toggles the checkbox
         </div>
         …content…
       </aside>
     </section>

   When the checkbox is :checked → tools column collapses to 44px,
   all pane content hides, toggle arrow flips to ›.
═══════════════════════════════════════════════════════════════ */

/* Hidden from layout — only its :checked state is used by CSS */
.tools-collapse-input {
  display: none;
}

/* ── Collapsed state ── */
.tools-collapse-input:checked ~ .agent-layout {
  grid-template-columns: 44px minmax(0, 1fr) 300px;
}

/* Hide all tools pane children except the pane-header when collapsed */
.tools-collapse-input:checked ~ .agent-layout .tools-pane > *:not(.pane-header) {
  display: none;
}

/* Center the header (only the arrow btn remains) when collapsed */
.tools-collapse-input:checked ~ .agent-layout .tools-pane .pane-header {
  justify-content: center;
  padding: 0;
}

/* Hide the "Agents & Tools" title when collapsed */
.tools-collapse-input:checked ~ .agent-layout .tools-pane .pane-title {
  display: none;
}

/* Flip the ‹ arrow to › when collapsed */
.tools-collapse-input:checked ~ .agent-layout .tools-collapse-btn {
  transform: scaleX(-1);
}

/* Tighter padding for the collapsed strip */
.tools-collapse-input:checked ~ .agent-layout .tools-pane {
  padding: 14px 4px;
  align-items: center;
  overflow: hidden;
}

/* ═══════════════════════════════════════════════════════════════
   USER MESSAGE — CHAT BUBBLE REDESIGN
   Reference: right-aligned blue bubble + circular user avatar icon.

   DOM structure generated by JS (unchanged):
     <article class="message user">
       <div class="sender">You <span class="msg-ts">2:32 PM</span></div>
       <div class="message-body">…text…</div>
     </article>

   CSS Grid places:
     col 1  → blue bubble  (message-body row 1, sender/timestamp row 2)
     col 2  → user icon    (::after, spans both rows, bottom-aligned)
═══════════════════════════════════════════════════════════════ */

/* ─── Outer container: transparent flex wrapper ─── */
.message.user {
  /* 2-col grid: [bubble] [avatar] */
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;     /* row1=body, row2=timestamp */
  column-gap: 10px;
  align-items: end;
  justify-self: end;
  max-width: min(78%, 540px);
  /* Strip the old box — bubble styling applied per child below */
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  color: inherit !important;
  /* keep the entry animation */
  animation: msgSlideIn 0.2s ease forwards;
}

/* ─── Message body — the visible blue bubble ─── */
.message.user .message-body {
  grid-column: 1;
  grid-row: 1;
  background: #266bf6;
  color: #ffffff;
  padding: 13px 16px 8px;
  /* High radius everywhere; bottom-right is small — "tail" points toward avatar */
  border-radius: 18px 18px 0 0;
  font-family: 'Inter', 'Avenir Next', sans-serif;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
  min-width: 0;
}

/* ─── Sender row — repurposed as the timestamp strip inside the bubble ─── */
.message.user .sender {
  grid-column: 1;
  grid-row: 2;
  background: #266bf6;
  /* Hide "YOU" label; only the .msg-ts child stays visible */
  font-size: 0;
  color: transparent;
  letter-spacing: 0;
  text-transform: none;
  margin-bottom: 0;
  padding: 0 16px 10px;
  text-align: right;
  /* Rounded bottom corners to complete the bubble */
  border-radius: 0 0 4px 18px;
}

/* ─── Timestamp — always visible inside the bubble ─── */
.message.user .sender .msg-ts {
  display: inline;
  float: none;
  font-size: 11px;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.65) !important;
  opacity: 1 !important;        /* override the default opacity:0 */
  margin: 0;
  letter-spacing: 0;
  text-transform: none;
}

/* ─── Inline code inside user bubble ─── */
.message.user .message-body code {
  background: rgba(255, 255, 255, 0.18);
  color: #ffffff;
}

/* ─── User avatar icon — right column, bottom-aligned, spans both rows ─── */
.message.user::after {
  content: "";
  grid-column: 2;
  grid-row: 1 / 3;              /* span bubble + timestamp rows */
  align-self: end;              /* sit at the bottom of the combined rows */
  width: 34px;
  height: 34px;
  flex-shrink: 0;
  border-radius: 50%;
  border: 2px solid #e5eeff;
  background-color: #eef2ff;
  /* Person silhouette icon via inline SVG data URI */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23266bf6'%3E%3Cpath d='M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px;
}

/* ───── Ops Dashboard — UX improvements ───── */
.dashboard-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.dashboard-toolbar-right {
  display: flex;
  align-items: center;
  gap: 10px;
}
.dashboard-freshness {
  font-size: 11px;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.dashboard-refresh-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  font-size: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--panel-strong);
  color: var(--ink);
  cursor: pointer;
}
.dashboard-refresh-btn:hover { border-color: var(--brand); color: var(--brand); }

/* Metric tile — now clickable */
.dash-metric {
  appearance: none;
  border: 1px solid var(--line);
  background: var(--panel-strong);
  text-align: left;
  font-family: inherit;
  color: var(--ink);
  padding: 10px 14px;
  border-radius: var(--radius-sm);
  cursor: default;
  transition: transform 100ms ease, border-color 120ms ease, box-shadow 120ms ease;
}
.dash-metric.is-clickable {
  cursor: pointer;
}
.dash-metric.is-clickable:hover {
  transform: translateY(-1px);
  border-color: var(--brand);
  box-shadow: 0 4px 10px rgba(var(--brand-rgb), 0.15);
}
.dash-metric.is-active {
  border-color: var(--brand);
  background: rgba(var(--brand-rgb), 0.08);
  box-shadow: inset 0 0 0 1px rgba(var(--brand-rgb), 0.3);
}
.dash-metric:disabled { cursor: default; opacity: 0.95; }
.dash-metric .dash-metric-value { font-size: 22px; font-weight: 700; }
.dash-metric .dash-metric-label { font-size: 11px; color: var(--muted); }

/* Filter pill */
.dash-filter-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 8px 0 6px;
  padding: 5px 10px;
  background: rgba(var(--brand-rgb), 0.08);
  color: var(--brand);
  border: 1px solid rgba(var(--brand-rgb), 0.28);
  border-radius: 999px;
  font-size: 12px;
}
.dash-filter-pill.tone-brand { color: var(--accent); background: rgba(var(--accent-rgb), 0.1); border-color: rgba(var(--accent-rgb), 0.35); }
.dash-filter-clear {
  border: none;
  background: transparent;
  color: inherit;
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: underline;
}

/* Left row — clickable, with chevron */
.dash-row {
  display: grid !important;
  grid-template-columns: 120px 110px 1fr auto 120px 14px;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--line);
  background: var(--panel-strong);
  border-radius: var(--radius-sm);
  margin-bottom: 6px;
  cursor: pointer;
  transition: background 120ms ease, border-color 120ms ease, box-shadow 120ms ease, transform 100ms ease;
}
.dash-row:hover {
  border-color: var(--brand);
  background: rgba(var(--brand-rgb), 0.04);
  transform: translateX(2px);
  box-shadow: 0 2px 6px rgba(var(--ink-rgb), 0.05);
}
.dash-row:focus-visible {
  outline: none;
  border-color: var(--brand);
  box-shadow: 0 0 0 2px rgba(var(--brand-rgb), 0.25);
}
.dash-row.is-selected {
  border-color: var(--accent);
  background: rgba(var(--accent-rgb), 0.07);
}
.dash-row-chevron {
  color: var(--muted);
  font-size: 11px;
  text-align: right;
}
.dash-row:hover .dash-row-chevron { color: var(--brand); }

/* Right notification card */
.dash-notify-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.dash-notify-count {
  background: rgba(var(--ink-rgb), 0.08);
  color: var(--ink);
  padding: 2px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
}
.dash-notify-item {
  position: relative;
  padding: 10px 12px 10px 14px;
  border: 1px solid var(--line);
  border-left-width: 3px;
  background: var(--panel-strong);
  border-radius: var(--radius-sm);
  margin-bottom: 8px;
  transition: border-color 120ms ease, background 120ms ease, transform 100ms ease, opacity 160ms ease;
}
.dash-notify-item.red    { border-left-color: var(--bad); }
.dash-notify-item.amber  { border-left-color: var(--accent); }
.dash-notify-item.blue   { border-left-color: var(--brand); }
.dash-notify-item.green  { border-left-color: var(--ok); }
.dash-notify-item.slate  { border-left-color: rgba(var(--muted-rgb), 0.5); }
.dash-notify-item.is-clickable {
  cursor: pointer;
  padding-right: 28px;
}
.dash-notify-item.is-clickable:hover {
  border-color: var(--brand);
  background: rgba(var(--brand-rgb), 0.03);
  transform: translateX(-2px);
}
.dash-notify-item.is-dim {
  opacity: 0.35;
}
.dash-notify-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 4px;
}
.dash-notify-kind {
  display: inline-flex;
  padding: 2px 8px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  border-radius: 999px;
  background: rgba(var(--muted-rgb), 0.12);
  color: var(--muted);
}
.dash-notify-kind.kind-exception { background: rgba(var(--bad-rgb), 0.14); color: var(--bad); }
.dash-notify-kind.kind-gate      { background: rgba(var(--accent-rgb), 0.16); color: var(--accent); }
.dash-notify-kind.kind-run       { background: rgba(var(--brand-rgb), 0.12); color: var(--brand); }
.dash-notify-time { font-size: 10px; color: var(--muted); }
.dash-notify-title { font-weight: 700; color: var(--ink); font-size: 12px; line-height: 1.35; }
.dash-notify-message { font-size: 11px; color: var(--muted); margin-top: 2px; }
.dash-notify-chevron {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--muted);
  font-size: 11px;
  transition: color 120ms ease, transform 120ms ease;
}
.dash-notify-item.is-clickable:hover .dash-notify-chevron {
  color: var(--brand);
  transform: translateY(-50%) translateX(2px);
}

/* Empty state */
.dash-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 24px 16px;
  color: var(--muted);
  font-size: 12px;
  text-align: center;
  border: 1px dashed var(--line);
  border-radius: var(--radius-sm);
  background: rgba(var(--ink-rgb), 0.02);
}
.dash-empty i { font-size: 22px; color: var(--muted); }

@media (max-width: 860px) {
  .dash-row { grid-template-columns: 1fr 1fr; }
  .dash-row-chevron, .dash-row-kind, .dash-note-col { grid-column: span 2; }
}

/* ───── Ops Dashboard — polished chips + per-row buttons ───── */

/* Suppress old pill styling with cleaner chips */
.dash-filter-pill { display: none !important; }

.dash-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 10px 0 8px;
  padding: 6px 10px 6px 12px;
  font-size: 12px;
  color: var(--ink);
  background: var(--panel-strong);
  border: 1px solid var(--line);
  border-radius: 999px;
  box-shadow: 0 1px 2px rgba(var(--ink-rgb), 0.04);
}
.dash-chip > i {
  font-size: 11px;
  color: var(--muted);
}
.dash-chip-text {
  color: var(--muted);
}
.dash-chip-text strong {
  color: var(--ink);
  font-weight: 700;
  margin-left: 2px;
}
.dash-chip-filter {
  border-color: rgba(var(--brand-rgb), 0.35);
  background: rgba(var(--brand-rgb), 0.05);
}
.dash-chip-filter > i { color: var(--brand); }
.dash-chip-selection {
  border-color: rgba(var(--accent-rgb), 0.4);
  background: rgba(var(--accent-rgb), 0.06);
}
.dash-chip-selection > i { color: var(--accent); }
.dash-chip-close {
  width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 50%;
  background: rgba(var(--ink-rgb), 0.06);
  color: var(--muted);
  cursor: pointer;
  font-size: 10px;
  padding: 0;
  transition: background 120ms ease, color 120ms ease;
}
.dash-chip-close:hover {
  background: rgba(var(--bad-rgb), 0.12);
  color: var(--bad);
}

/* Row — no longer clickable as a block; no hover transform */
.dash-row {
  grid-template-columns: 120px 110px 1fr auto 120px auto !important;
  cursor: default !important;
  transform: none !important;
}
.dash-row:hover {
  background: var(--panel-strong) !important;
  border-color: var(--line) !important;
  transform: none !important;
  box-shadow: none !important;
}
.dash-row.is-selected {
  border-color: var(--accent);
  background: rgba(var(--accent-rgb), 0.05);
}
.dash-row-chevron { display: none !important; }

.dash-row-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.dash-row-trail-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  font-size: 11px;
  font-weight: 600;
  color: var(--brand);
  background: rgba(var(--brand-rgb), 0.08);
  border: 1px solid rgba(var(--brand-rgb), 0.25);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background 120ms ease, color 120ms ease, border-color 120ms ease, transform 100ms ease;
  white-space: nowrap;
}
.dash-row-trail-btn:hover {
  background: var(--brand);
  color: #fff;
  border-color: var(--brand);
  transform: translateY(-1px);
}
.dash-row-trail-btn i { font-size: 10px; }

.dash-row-filter-btn {
  width: 26px;
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: var(--panel-strong);
  color: var(--muted);
  cursor: pointer;
  font-size: 11px;
  transition: background 120ms ease, color 120ms ease, border-color 120ms ease, transform 120ms ease;
}
.dash-row-filter-btn:hover {
  border-color: var(--accent);
  color: var(--accent);
  background: rgba(var(--accent-rgb), 0.1);
  transform: translateX(2px);
}
.dash-row-filter-btn.is-active {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
  transform: rotate(180deg);
}
.dash-row-filter-btn.is-active:hover {
  background: var(--bad);
  border-color: var(--bad);
  transform: rotate(180deg) translateX(-2px);
}

/* Drop the notification chevron we removed */
.dash-notify-chevron { display: none !important; }
.dash-notify-item.is-clickable { padding-right: 12px; }

@media (max-width: 860px) {
  .dash-row {
    grid-template-columns: 1fr 1fr !important;
  }
  .dash-row-actions { grid-column: span 2; justify-content: flex-end; }
}

/* ── Step cards — persistent agent-work cards streamed into the chat pane. ── */
.message.assistant-step {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  max-width: 82%;
  align-self: flex-start;
}
.message.assistant-step .message-body { all: unset; display: block; }
.message.assistant-step .sender { display: none; }

.step-card {
  background: #fff;
  border: 1px solid #E2E8F0;
  border-left: 3px solid #0468FF;
  border-radius: 10px;
  padding: 0.85rem 1rem;
  font-size: 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-family: "Inter", "Avenir Next", system-ui, sans-serif;
  color: #2D3748;
}
.step-card.ok { border-left-color: #059669; }
.step-card.warn { border-left-color: #D97706; }
.step-card.bad { border-left-color: #DC2626; }
.step-card.run { border-left-color: #0468FF; }

.step-card .sc-head {
  display: flex;
  align-items: center;
  gap: 8px;
}
.step-card .sc-ico {
  width: 26px;
  height: 26px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #E6F0FF;
  color: #0468FF;
  font-size: 12px;
  flex-shrink: 0;
}
.step-card.ok .sc-ico { background: #ECFDF5; color: #059669; }
.step-card.warn .sc-ico { background: #FFFBEB; color: #D97706; }
.step-card.bad .sc-ico { background: #FEF2F2; color: #DC2626; }

.step-card .sc-title {
  font-family: "Sora", "Manrope", "Inter", sans-serif;
  font-size: 12.5px;
  font-weight: 700;
  color: #0D1526;
  flex: 1;
  min-width: 0;
}
.step-card .sc-status {
  font-size: 9px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 4px;
  letter-spacing: .4px;
  text-transform: uppercase;
  white-space: nowrap;
  background: #ECFDF5;
  color: #065F46;
  border: 1px solid #BBF7D0;
}
.step-card .sc-status.warn { background: #FFFBEB; color: #92400E; border-color: #FDE68A; }
.step-card .sc-status.bad { background: #FEF2F2; color: #991B1B; border-color: #FECACA; }
.step-card .sc-status.run { background: #E6F0FF; color: #0352CC; border-color: #CCE0FF; }

.step-card .sc-desc {
  color: #2D3748;
  line-height: 1.55;
  font-size: 12px;
}
.step-card .sc-row {
  display: flex;
  gap: 10px;
  font-size: 11.5px;
  color: #2D3748;
  line-height: 1.55;
  align-items: flex-start;
}
.step-card .sc-row-lbl {
  flex: 0 0 60px;
  font-weight: 700;
  color: #94A3B8;
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: .7px;
  padding-top: 2px;
}
.step-card .sc-row-val {
  flex: 1;
  min-width: 0;
  word-break: break-word;
}
.step-card .sc-row-val code {
  background: #F4F6FA;
  border: 1px solid #E2E8F0;
  border-radius: 4px;
  padding: 1px 6px;
  font-size: 10.5px;
  font-family: "JetBrains Mono", "SF Mono", Menlo, monospace;
  color: #2D3748;
}

/* Expandable decision trail inside a step card */
.step-card .sc-head { cursor: pointer; user-select: none; }
.step-card .sc-head:hover .sc-title { color: #0468FF; }
.step-card.sc-expanded {
  box-shadow: 0 4px 12px rgba(4, 104, 255, .08);
}
.step-card .sc-chevron {
  font-size: 10px;
  color: #94A3B8;
  transition: transform 160ms ease, color 160ms ease;
  flex-shrink: 0;
  margin-left: 4px;
}
.step-card.sc-expanded .sc-chevron {
  transform: rotate(180deg);
  color: #0468FF;
}
.step-card .sc-body {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.step-card .sc-body[hidden] { display: none; }
.step-card .sc-toggle {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 600;
  color: #0468FF;
  background: transparent;
  border: 1px dashed #CCE0FF;
  border-radius: 6px;
  padding: 4px 10px;
  margin-top: 6px;
  cursor: pointer;
  width: fit-content;
  font-family: inherit;
}
.step-card .sc-toggle:hover {
  background: #E6F0FF;
  border-style: solid;
}
.step-card .sc-toggle i { font-size: 9px; }
.step-card.sc-expanded .sc-toggle { border-style: solid; }

.step-card .sc-details {
  margin-top: 8px;
  padding-top: 10px;
  padding-right: 4px;
  border-top: 1px dashed #E2E8F0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  /* Cap the decision-trail height so verbose agents (e.g. Fraud with many
     tool results) stay inside the card. Internal scroll keeps the next
     chat message visible without the user having to collapse first. */
  max-height: 340px;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.step-card .sc-details::-webkit-scrollbar { width: 6px; }
.step-card .sc-details::-webkit-scrollbar-thumb {
  background: #CBD5E1;
  border-radius: 3px;
}
.step-card .sc-details[hidden] { display: none; }

.step-card .sc-details-meta {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 12px;
  font-size: 11px;
}
.step-card .sc-meta-row {
  display: contents;
}
.step-card .sc-meta-k {
  color: #94A3B8;
  font-weight: 600;
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: .7px;
  padding-top: 3px;
}
.step-card .sc-meta-v {
  color: #2D3748;
  word-break: break-word;
}
.step-card .sc-meta-v code {
  background: #F4F6FA;
  border: 1px solid #E2E8F0;
  border-radius: 4px;
  padding: 1px 6px;
  font-size: 10.5px;
  font-family: "JetBrains Mono", "SF Mono", Menlo, monospace;
  color: #2D3748;
}
.step-card .sc-outcome {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-weight: 600;
  font-size: 11px;
}
.step-card .sc-outcome.ok { color: #059669; }
.step-card .sc-outcome.warn { color: #D97706; }

.step-card .sc-sub-title {
  font-size: 9.5px;
  font-weight: 700;
  color: #94A3B8;
  text-transform: uppercase;
  letter-spacing: .7px;
  margin-top: 2px;
}
.step-card .sc-rationale {
  background: #F0F7FF;
  border: 1px solid #CCE0FF;
  border-left: 3px solid #0468FF;
  border-radius: 6px;
  padding: 8px 10px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.step-card .sc-rationale-headline {
  font-weight: 700;
  font-size: 12px;
  color: #0D1526;
}
.step-card .sc-rationale-detail {
  font-size: 11.5px;
  color: #2D3748;
  line-height: 1.5;
}
.step-card .sc-tool {
  background: #F8FAFC;
  border: 1px solid #E2E8F0;
  border-radius: 6px;
  padding: 8px 10px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.step-card .sc-tool-head {
  display: flex;
  align-items: center;
  gap: 8px;
}
.step-card .sc-tool-head code {
  background: #fff;
  border: 1px solid #E2E8F0;
  border-radius: 4px;
  padding: 1px 6px;
  font-size: 10.5px;
  font-family: "JetBrains Mono", "SF Mono", Menlo, monospace;
  color: #2D3748;
  flex-shrink: 0;
}
.step-card .sc-tool-time {
  font-family: "JetBrains Mono", "SF Mono", Menlo, monospace;
  font-size: 10px;
  color: #94A3B8;
}
.step-card .sc-tool-status {
  margin-left: auto;
  font-size: 11px;
}
.step-card .sc-tool-status.ok { color: #059669; }
.step-card .sc-tool-status.warn { color: #D97706; }
.step-card .sc-tool-summary {
  color: #2D3748;
  font-size: 11px;
  line-height: 1.5;
  word-break: break-word;
}
.step-card .sc-tool-confidence {
  font-size: 10.5px;
  color: #64748B;
  font-style: italic;
}
.step-card .sc-exception {
  background: #FEF2F2;
  border: 1px solid #FECACA;
  border-radius: 6px;
  padding: 8px 10px;
  font-size: 11px;
  color: #991B1B;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.step-card .sc-exception i { color: #DC2626; }
.step-card .sc-exception strong { font-weight: 700; }
.step-card .sc-exception-summary {
  flex-basis: 100%;
  color: #2D3748;
  font-weight: 500;
  font-size: 10.5px;
  margin-top: 2px;
}
.step-card .sc-error {
  background: #FEF2F2;
  border: 1px solid #FECACA;
  border-radius: 6px;
  padding: 6px 10px;
  font-size: 11px;
  color: #991B1B;
}
.step-card .sc-error i { color: #DC2626; margin-right: 4px; }

/* ── Pinned summary card (Workspace Completed · mockup ④) ──────────── */
.message.assistant-step .pinned-summary {
  background: linear-gradient(135deg, #F0F7FF, #FFFFFF);
  border: 1px solid #CCE0FF;
  border-radius: 12px;
  padding: 1.1rem 1.25rem;
  box-shadow: 0 2px 12px rgba(4, 104, 255, .08);
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-width: 100%;
}
.message.assistant-step .pinned-summary::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, #0468FF, #2684FF);
  border-radius: 12px 12px 0 0;
}
.pin-pin {
  position: absolute;
  top: 10px;
  right: 12px;
  font-size: 10px;
  color: #0468FF;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-weight: 600;
  background: rgba(230, 240, 255, .9);
  padding: 3px 8px;
  border-radius: 20px;
  border: 1px solid #CCE0FF;
}
.pin-head {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 8px;
  padding-right: 120px;
}
.pin-ico {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: #0468FF;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  flex-shrink: 0;
}
.pin-ico.pin-ico-approve { background: #059669; }
.pin-ico.pin-ico-escalate { background: #DC2626; }
.pin-ico.pin-ico-info { background: #D97706; }
.pin-title {
  font-family: "Sora", "Manrope", "Inter", sans-serif;
  font-size: 13.5px;
  font-weight: 700;
  color: #0D1526;
  line-height: 1.35;
}
.pin-sub {
  font-size: 11px;
  color: #64748B;
  margin-top: 2px;
}
.pin-badge {
  margin-left: auto;
  font-size: 9.5px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 5px;
  text-transform: uppercase;
  letter-spacing: .5px;
  white-space: nowrap;
  flex-shrink: 0;
}
.pin-badge.pin-badge-approve { background: #ECFDF5; color: #065F46; border: 1px solid #BBF7D0; }
.pin-badge.pin-badge-escalate { background: #FEF2F2; color: #991B1B; border: 1px solid #FECACA; }
.pin-badge.pin-badge-info { background: #FFFBEB; color: #92400E; border: 1px solid #FDE68A; }
.pin-row {
  display: flex;
  gap: 10px;
  font-size: 11.5px;
  line-height: 1.5;
  padding: 3px 0;
}
.pin-row-lbl {
  flex: 0 0 110px;
  color: #94A3B8;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 9.5px;
  letter-spacing: .7px;
  padding-top: 3px;
}
.pin-row-val {
  flex: 1;
  color: #2D3748;
  word-break: break-word;
}
.pin-row-val strong { color: #0D1526; }
.pin-chips {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px;
}
.pin-chip {
  font-size: 10px;
  padding: 2px 8px;
  border-radius: 4px;
  background: #fff;
  border: 1px solid #E2E8F0;
  color: #2D3748;
  font-weight: 500;
  white-space: nowrap;
}

/* Expandable pinned-summary sections (mirrors Run Summary modal content) */
.pin-toggle {
  margin-top: 10px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 600;
  color: #0468FF;
  background: transparent;
  border: 1px dashed #CCE0FF;
  border-radius: 6px;
  padding: 5px 10px;
  cursor: pointer;
  width: fit-content;
  font-family: inherit;
}
.pin-toggle:hover { background: #E6F0FF; border-style: solid; }
.pin-toggle i { font-size: 9px; }
.pinned-summary.pin-expanded-open .pin-toggle { border-style: solid; }
.pin-expanded {
  margin-top: 10px;
  padding-top: 12px;
  border-top: 1px dashed #CCE0FF;
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-height: 540px;
  overflow-y: auto;
  padding-right: 4px;
}
.pin-expanded[hidden] { display: none; }
.pin-section {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.pin-section-title {
  font-family: "Sora", "Manrope", "Inter", sans-serif;
  font-size: 10px;
  font-weight: 700;
  color: #94A3B8;
  text-transform: uppercase;
  letter-spacing: .8px;
}
.pin-section-body {
  font-size: 11.5px;
  color: #2D3748;
  line-height: 1.6;
}
.pin-narrative {
  background: #F8FAFC;
  border: 1px solid #E2E8F0;
  border-radius: 6px;
  padding: 10px 12px;
}
.pin-outcome-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.pin-outcome {
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 10px;
  padding: 8px 10px;
  background: #F8FAFC;
  border: 1px solid #E2E8F0;
  border-radius: 6px;
  font-size: 11px;
}
.pin-outcome strong {
  color: #0D1526;
  font-family: "Sora", "Manrope", "Inter", sans-serif;
}
.pin-flags {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.pin-flag {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 11px;
  color: #2D3748;
  line-height: 1.5;
}
.pin-flag i { font-size: 11px; flex-shrink: 0; margin-top: 2px; }
.pin-flag.pass i { color: #059669; }
.pin-flag.warn i { color: #D97706; }
.pin-flag.bad i { color: #DC2626; }
.pin-flag strong { color: #0D1526; font-weight: 700; }
.pin-letter {
  background: #F8FAFC;
  border: 1px solid #E2E8F0;
  border-radius: 6px;
  padding: 10px 12px;
  font-size: 11px;
  color: #2D3748;
  line-height: 1.6;
  white-space: pre-wrap;
  max-height: 240px;
  overflow-y: auto;
}
.pin-kv {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px 16px;
  font-size: 11px;
}
.pin-kv-row {
  display: flex;
  justify-content: space-between;
  gap: 6px;
  padding: 4px 0;
  border-bottom: 1px solid #EEF2F7;
}
.pin-kv-k { color: #94A3B8; font-weight: 600; }
.pin-kv-v { color: #0D1526; font-weight: 600; text-align: right; }

/* ── "Now Running" sticky strip — shows live agents concurrently ───── */
.now-running {
  position: sticky;
  top: 0;
  z-index: 6;
  align-self: stretch;
  flex: 0 0 auto;
  margin: 0 -18px 10px;
  padding: 8px 18px;
  background: linear-gradient(90deg, rgba(240, 247, 255, .98), rgba(255, 255, 255, .98));
  backdrop-filter: saturate(140%) blur(6px);
  -webkit-backdrop-filter: saturate(140%) blur(6px);
  border-bottom: 1px solid #CCE0FF;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 38px;
  flex-wrap: wrap;
}
.now-running[hidden] { display: none; }
.nr-label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 10px;
  font-weight: 700;
  color: #0352CC;
  text-transform: uppercase;
  letter-spacing: .8px;
  flex-shrink: 0;
}
.nr-label-count {
  font-family: "Sora", "Manrope", "Inter", sans-serif;
  background: #0468FF;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  padding: 1px 7px;
  border-radius: 10px;
  letter-spacing: 0;
  text-transform: none;
}
.nr-chips {
  display: flex;
  gap: 6px;
  flex: 1;
  flex-wrap: wrap;
  min-width: 0;
}
.nr-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #fff;
  border: 1px solid #CCE0FF;
  border-radius: 20px;
  padding: 3px 10px 3px 6px;
  font-size: 11px;
  color: #2D3748;
  font-weight: 500;
  position: relative;
  overflow: hidden;
}
.nr-chip::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(4, 104, 255, .10), transparent);
  animation: nr-shimmer 2s linear infinite;
  pointer-events: none;
}
@keyframes nr-shimmer {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}
.nr-chip-code {
  font-family: "JetBrains Mono", "SF Mono", Menlo, monospace;
  font-size: 9px;
  font-weight: 700;
  color: #0468FF;
  background: #E6F0FF;
  padding: 2px 6px;
  border-radius: 20px;
  z-index: 1;
  position: relative;
}
.nr-chip-name {
  z-index: 1;
  position: relative;
  font-weight: 600;
  color: #0D1526;
}
.nr-chip-task {
  z-index: 1;
  position: relative;
  color: #64748B;
  font-size: 10px;
}

/* ── Parallel group wrapper — one container around concurrent cards ─ */
.parallel-group {
  align-self: flex-start;
  max-width: 92%;
  background: linear-gradient(180deg, rgba(240, 247, 255, .55), #fff);
  border: 1px solid #CCE0FF;
  border-radius: 12px;
  padding: 10px 12px 12px;
  position: relative;
}
.parallel-group::before {
  content: '';
  position: absolute;
  left: 12px;
  top: 42px;
  bottom: 14px;
  width: 2px;
  background: linear-gradient(180deg, #0468FF, #CCE0FF);
  border-radius: 2px;
  opacity: .7;
}
.pg-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 2px 4px 8px;
  font-size: 11px;
  color: #2D3748;
  flex-wrap: wrap;
}
.pg-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: #0468FF;
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 20px;
  text-transform: uppercase;
  letter-spacing: .5px;
}
.pg-pill i { font-size: 9px; }
.pg-head strong { color: #0D1526; font-weight: 700; }
.pg-head .pg-sub { color: #64748B; font-size: 10px; }
.pg-tree {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-left: 24px;
  position: relative;
}
.pg-tree > .step-card {
  max-width: 100%;
  position: relative;
  align-self: stretch;
}
.pg-tree > .step-card::before {
  content: '';
  position: absolute;
  left: -14px;
  top: 18px;
  width: 12px;
  height: 2px;
  background: #CCE0FF;
  border-radius: 1px;
}
.pg-tree > .step-card.run::before { background: #0468FF; }

/* ── NewScenario chat cards ────────────────────────────────────────── */
.newscenario-card {
  border: 1px solid #d9e5ff;
  border-radius: 10px;
  padding: 14px 16px;
  background: #f7faff;
  margin: 8px 0;
}

/* Centered chat card variant — used by the standalone NIGO email
   correspondence announcement so the reviewer immediately sees the
   notification rendered in the middle of the chat column. */
.centered-chat-card {
  margin-left: auto;
  margin-right: auto;
  max-width: 720px;
  width: 100%;
  box-shadow: 0 6px 20px rgba(15, 23, 42, 0.06);
}

.nigo-email-card {
  background: linear-gradient(180deg, #f1f7ff 0%, #ffffff 60%);
  border: 1px solid #c7d8ff;
  padding: 18px 20px;
}
.nigo-email-card .ns-email-head {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 14px;
  padding-bottom: 14px;
  border-bottom: 1px dashed rgba(0, 51, 135, 0.18);
}
.nigo-email-card .ns-email-icon {
  width: 38px;
  height: 38px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #003087;
  color: #ffffff;
  font-size: 17px;
  flex-shrink: 0;
}
.nigo-email-card .ns-email-titlewrap {
  flex: 1;
  min-width: 0;
}
.nigo-email-card .ns-email-eyebrow {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.6px;
  color: #003087;
  text-transform: uppercase;
  margin-bottom: 3px;
}
.nigo-email-card .ns-email-title {
  margin: 0 0 4px;
  font-family: "Manrope", "Inter", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: #0d1526;
  line-height: 1.35;
}
.nigo-email-card .ns-email-sub {
  margin: 0;
  font-size: 13px;
  color: #475569;
  line-height: 1.5;
}
.newscenario-card .ns-title {
  font-weight: 600;
  font-size: 15px;
  color: #1a365d;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}
.newscenario-card .ns-sub {
  color: #475569;
  font-size: 13px;
  margin-bottom: 10px;
}
.newscenario-card .ns-nigo-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 10px;
}
.newscenario-card .ns-nigo-row {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  grid-template-areas:
    "label action"
    "status status";
  gap: 8px 10px;
  align-items: center;
  padding: 10px 12px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
}
.newscenario-card .ns-nigo-label {
  font-size: 13px;
  font-weight: 500;
  color: #1e293b;
  grid-area: label;
  min-width: 0;
}
.newscenario-card .ns-nigo-form {
  color: #94a3b8;
  font-weight: 400;
  font-size: 11.5px;
  letter-spacing: 0.02em;
}
.newscenario-card .ns-attach-btn {
  grid-area: action;
  white-space: nowrap;
  justify-self: end;
  /* Subtle white outline button — overrides the legacy `primary` blue
   * fill so Attach reads as a quiet secondary action against the card.
   * Stays consistent before and after a file is staged. */
  background: #FFFFFF;
  color: #1F3B73;
  border: 1px solid #C6D5EE;
  box-shadow: none;
}
.newscenario-card .ns-attach-btn:hover,
.newscenario-card .ns-attach-btn:focus-visible {
  background: #F1F5FB;
  border-color: #93B1E0;
  outline: none;
}
.newscenario-card .ns-attach-btn i {
  color: #1F3B73;
}
/* When a file is staged the row picks up an extra "filename" track so
   the green pill sits BELOW the doc label (not crammed in beside the
   Attach button). The action column stays clean — just the persistent
   Attach button, which doubles as Re-attach. */
.newscenario-card .ns-nigo-row.is-staged {
  grid-template-areas:
    "label    action"
    "filename action"
    "status   status";
}
/* Filename pill rendered as a button so the reviewer can click it to
   preview the staged file in the in-app viewer. Subtle styling — looks
   like a chip-link, not another action button. */
.newscenario-card .ns-nigo-filename {
  grid-area: filename;
  align-self: start;
  justify-self: start;
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  margin: 4px 0 0;
  padding: 3px 10px;
  background: #ECFDF5;
  border: 1px solid #BBF7D0;
  color: #166534;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
  font-family: inherit;
  line-height: 1.4;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color 120ms ease, border-color 120ms ease;
}
/* The HTML `hidden` attribute defaults to `display:none`, but our
   `display:inline-flex` above overrides that. Force it back so the empty
   filename pill stays invisible until a file is actually staged. */
.newscenario-card .ns-nigo-filename[hidden] {
  display: none !important;
}
.newscenario-card .ns-nigo-filename::before {
  content: "\f15b"; /* fa-file */
  font-family: "Font Awesome 6 Free";
  font-weight: 400;
  margin-right: 6px;
  color: #15803d;
}
.newscenario-card .ns-nigo-filename:hover,
.newscenario-card .ns-nigo-filename:focus-visible {
  background: #DCFCE7;
  border-color: #86EFAC;
  outline: none;
  text-decoration: underline;
}
/* Rejected state — filename pill flips from green to red so an
   unexpected file is unmistakable at a glance. The Process button is
   also blocked while any row is in this state (handled in chat.js). */
.newscenario-card .ns-nigo-row.is-rejected .ns-nigo-filename {
  background: #FEF2F2;
  border-color: #FECACA;
  color: #991B1B;
}
.newscenario-card .ns-nigo-row.is-rejected .ns-nigo-filename::before {
  color: #B91C1C;
  content: "\f071"; /* fa-triangle-exclamation */
  font-weight: 900;
}
.newscenario-card .ns-nigo-row.is-rejected .ns-nigo-filename:hover,
.newscenario-card .ns-nigo-row.is-rejected .ns-nigo-filename:focus-visible {
  background: #FEE2E2;
  border-color: #FCA5A5;
}
/* When a file is staged, swap the Attach button's emphasis from primary
   to a subtler outline so the eye lands on the filename pill (the new
   thing) rather than the call-to-action it already satisfied. */
.newscenario-card .ns-nigo-row.is-staged .ns-attach-btn {
  background: #FFFFFF;
  color: #1F3B73;
  border: 1px solid #C6D5EE;
  box-shadow: none;
}
.newscenario-card .ns-nigo-row.is-staged .ns-attach-btn:hover {
  background: #F1F5FB;
}
.newscenario-card .ns-status {
  grid-area: status;
  font-size: 12px;
  color: #16a34a;
  text-align: left;
  word-break: break-word;
  min-width: 0;
}
.newscenario-card .ns-status:empty { display: none; }
.newscenario-card .ns-status.error {
  color: #991b1b;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 6px;
  padding: 8px 10px;
  display: flex;
  align-items: flex-start;
  gap: 6px;
  line-height: 1.4;
}
.newscenario-card .ns-status.error::before {
  content: "\f071";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  color: #b91c1c;
  flex: none;
  margin-top: 1px;
}
/* Visual lock state — row still readable but unmistakably inactive. */
.newscenario-card .ns-nigo-row.is-locked {
  background: #f1f5f9;
  border-color: #cbd5e1;
}
.newscenario-card .ns-nigo-row.is-locked .ns-nigo-label {
  color: #475569;
}
.newscenario-card .ns-attach-btn.attached,
.newscenario-card .ns-attach-btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  filter: grayscale(0.2);
  pointer-events: none;
}
.newscenario-card .ns-process-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/* Live Adjudication Package snapshot rendered inline in the chat when NIGO
   pauses the pipeline. Mirrors the right-pane layout so the reviewer can see
   extracted fields + the draft RFI letter without needing the side panel. */
.nigo-snapshot-card {
  background: #fff;
  border: 1px solid #dbe3ef;
  border-radius: 12px;
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
}
.ns-snap-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.ns-snap-eyebrow {
  font-size: 11px;
  font-weight: 600;
  color: #6b7280;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.ns-snap-title {
  font-size: 16px;
  font-weight: 600;
  color: #0f172a;
  margin-top: 2px;
}
.ns-snap-rec {
  font-size: 12px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 999px;
  background: #eef2ff;
  color: #3730a3;
  white-space: nowrap;
}
.ns-snap-rec.info { background: #eef2ff; color: #3730a3; }
.ns-snap-rec.approve { background: #dcfce7; color: #166534; }
.ns-snap-rec.reject { background: #fee2e2; color: #991b1b; }
.ns-snap-rec.neutral { background: #f3f4f6; color: #4b5563; }

.ns-snap-section {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ns-snap-section-title {
  font-size: 12px;
  font-weight: 600;
  color: #6b7280;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.ns-snap-rationale {
  font-size: 13px;
  color: #1f2937;
  line-height: 1.5;
  background: #f9fafb;
  border-left: 3px solid #94a3b8;
  padding: 8px 12px;
  border-radius: 0 6px 6px 0;
}
/* Neutralise any nested letter-body/pre styling so the draft correspondence
   in the NIGO snapshot reads as a clean letter (white background, dark text)
   instead of inheriting any colored panel bg from a parent container. */
.nigo-snapshot-card .letter-card,
.nigo-snapshot-card .letter-card .letter-body-wrap,
.nigo-snapshot-card .letter-card .letter-body,
.nigo-snapshot-card .letter-card pre {
  background: #ffffff !important;
  color: #1f2937 !important;
}
.nigo-snapshot-card .letter-body {
  font-family: 'Segoe UI', Arial, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}
.ns-snap-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 6px 24px;
}
.ns-snap-kv {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 6px 0;
  border-bottom: 1px dashed #eef1f5;
}
.ns-snap-kv span { font-size: 11px; color: #6b7280; }
.ns-snap-kv strong { font-size: 13px; color: #0f172a; font-weight: 600; }
.ns-snap-flags { display: flex; flex-direction: column; gap: 4px; }
.ns-snap-flag {
  font-size: 13px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.ns-snap-flag.pass { color: #16a34a; }
.ns-snap-flag.warn { color: #ca8a04; }
.ns-snap-flag.bad  { color: #b91c1c; }
.newscenario-card .ns-attach-btn.attached {
  background: #dcfce7;
  color: #166534;
  border-color: #86efac;
}
.newscenario-card .ns-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}
.fraud-report-card {
  border-color: #fecaca;
  background: #fef2f2;
}
.fraud-report-card .ns-title { color: #991b1b; }
/* Headline block: title + subline share the same left edge. */
.fraud-report-card .ns-fraud-headline {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  margin-bottom: 10px;
}
.fraud-report-card .ns-fraud-headline .ns-title { margin-bottom: 0; }
.fraud-report-card .ns-fraud-headline .ns-sub {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
}
/* Red non-clickable button-style pill for the fraud score. */
.fraud-report-card .ns-fraud-score-pill {
  display: inline-flex;
  align-items: center;
  background: #dc2626;
  color: #ffffff;
  border: 1px solid #b91c1c;
  border-radius: 999px;
  padding: 3px 10px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .2px;
  pointer-events: none;
  cursor: default;
  user-select: none;
  font-variant-numeric: tabular-nums;
}
.fraud-report-card .ns-fraud-info-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  padding: 0;
  margin: 0;
  border-radius: 999px;
  background: transparent;
  border: 1px solid transparent;
  color: #991b1b;
  cursor: pointer;
  font-size: 14px;
  line-height: 1;
  transition: background 120ms ease, border-color 120ms ease, color 120ms ease;
}
.fraud-report-card .ns-fraud-info-btn:hover,
.fraud-report-card .ns-fraud-info-btn:focus-visible {
  background: #fee2e2;
  border-color: #fecaca;
  color: #7f1d1d;
  outline: none;
}
.fraud-report-card .ns-fraud-risk-tag {
  display: inline-flex;
  align-items: center;
  background: #fee2e2;
  color: #991b1b;
  border: 1px solid #fecaca;
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.fraud-report-card .ns-fraud-flags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}
.fraud-report-card .ns-fraud-flag {
  display: inline-block;
  padding: 3px 8px;
  font-size: 12px;
  background: #fee2e2;
  color: #991b1b;
  border-radius: 999px;
  border: 1px solid #fca5a5;
  cursor: help;
}
.fraud-report-card .ns-fraud-list {
  list-style: none;
  margin: 0 0 10px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.fraud-report-card .ns-fraud-item {
  background: #ffffff;
  border: 1px solid #fecaca;
  border-radius: 6px;
  padding: 8px 10px;
}
.fraud-report-card .ns-fraud-item-head {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 13px;
  color: #1f2937;
}
.fraud-report-card .ns-fraud-pct {
  color: #991b1b;
  font-weight: 700;
  min-width: 56px;
  font-variant-numeric: tabular-nums;
}
.fraud-report-card .ns-fraud-label {
  font-weight: 600;
  flex: 1 1 auto;
}
.fraud-report-card .ns-fraud-evidence {
  font-size: 12px;
  color: #475569;
  margin-top: 4px;
  padding-left: 64px;
  line-height: 1.55;
}
.fraud-report-card .ns-fraud-evidence-text {
  /* Inline with pills so citation chips flow at the end of the evidence
     sentence, the way ChatGPT renders source pills after a claim. */
  display: inline;
}
.fraud-report-card .ns-fraud-pills {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-left: 6px;
  vertical-align: middle;
}
.fraud-report-card .ns-fraud-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 8px;
  font-size: 11px;
  line-height: 1.6;
  color: #334155;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  text-decoration: none;
  max-width: 220px;
  transition: background 120ms ease, border-color 120ms ease, color 120ms ease;
}
.fraud-report-card .ns-fraud-pill:hover {
  background: #e2e8f0;
  border-color: #cbd5e1;
  color: #1e293b;
}
.fraud-report-card .ns-fraud-pill i {
  font-size: 11px;
  color: #2b579a; /* Word-document blue, matches the inputs drawer file icon */
}
.fraud-report-card .ns-fraud-pill-label {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* SIU score explainer popover. Uses fixed positioning so the JS
   clamping math (computed against the chat-log's getBoundingClientRect)
   maps directly to viewport coordinates — preventing the popover from
   visually overlapping the header or input bar that surround the
   chat column. */
.fraud-info-popover {
  position: fixed;
  z-index: 80;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.18), 0 2px 6px rgba(15, 23, 42, 0.06);
  font-family: inherit;
  color: #0f172a;
  max-height: calc(100vh - 32px);
  overflow: auto;
}
.fraud-info-popover.hidden { display: none; }
.fraud-info-popover .fip-arrow {
  position: absolute;
  top: -7px;
  width: 12px;
  height: 12px;
  background: #ffffff;
  border-left: 1px solid #e2e8f0;
  border-top: 1px solid #e2e8f0;
  transform: rotate(45deg);
}
/* When the popover is flipped above its anchor, point the arrow downward. */
.fraud-info-popover.fip-above .fip-arrow {
  top: auto;
  bottom: -7px;
  border-left: none;
  border-top: none;
  border-right: 1px solid #e2e8f0;
  border-bottom: 1px solid #e2e8f0;
}
.fraud-info-popover .fip-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px 6px;
}
.fraud-info-popover .fip-eyebrow {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #64748b;
}
.fraud-info-popover .fip-close {
  background: transparent;
  border: none;
  color: #64748b;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  padding: 0;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.fraud-info-popover .fip-close:hover {
  background: #f1f5f9;
  color: #0f172a;
}
.fraud-info-popover .fip-body {
  padding: 0 14px 14px;
}
.fraud-info-popover .fip-lede {
  margin: 0 0 10px;
  font-size: 12.5px;
  line-height: 1.55;
  color: #334155;
}
.fraud-info-popover .fip-section-title {
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #475569;
  margin: 4px 0 6px;
}
.fraud-info-popover .fip-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 12.5px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  overflow: hidden;
}
.fraud-info-popover .fip-table th,
.fraud-info-popover .fip-table td {
  text-align: left;
  padding: 7px 10px;
  border-top: 1px solid #e2e8f0;
}
.fraud-info-popover .fip-table thead th {
  background: #f8fafc;
  border-top: none;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #64748b;
}
.fraud-info-popover .fip-table td:first-child {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  white-space: nowrap;
}
.fraud-info-popover .fip-row-low td:nth-child(2)      { color: #166534; font-weight: 700; }
.fraud-info-popover .fip-row-medium td:nth-child(2)   { color: #92400e; font-weight: 700; }
.fraud-info-popover .fip-row-high td:nth-child(2)     { color: #c2410c; font-weight: 700; }
.fraud-info-popover .fip-row-critical td:nth-child(2) { color: #b91c1c; font-weight: 700; }
.fraud-info-popover .fip-row-low      { background: #f0fdf4; }
.fraud-info-popover .fip-row-medium   { background: #fffbeb; }
.fraud-info-popover .fip-row-high     { background: #fff7ed; }
.fraud-info-popover .fip-row-critical { background: #fef2f2; }

/* ── FinGuard exception details ──────────────────────────────────────
   Facts grid up top, then three AI-analysis sections (root cause,
   impact, action) rendered with bold headings + sentence-level bullets
   so reviewers can scan instead of reading a wall of text. */
.exc-finguard-detail {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.exc-finguard-detail .fg-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 16px;
  margin: 0;
  padding: 0;
}
.exc-finguard-detail .fg-fact {
  display: flex;
  flex-direction: column;
  gap: 1px;
  padding: 6px 10px;
  background: rgba(15, 42, 86, 0.04);
  border: 1px solid rgba(15, 42, 86, 0.10);
  border-radius: 6px;
  margin: 0;
}
.exc-finguard-detail .fg-fact dt {
  font-size: 10.5px;
  letter-spacing: .04em;
  text-transform: uppercase;
  font-weight: 700;
  color: #4F5B88;
}
.exc-finguard-detail .fg-fact dd {
  margin: 0;
  font-size: 13px;
  color: #0F1A33;
  font-weight: 600;
  word-break: break-word;
}

/* "FinGuard AI Analysis" eyebrow: a tiny pill above the three sections
   so reviewers see at a glance that what follows is AI-generated. */
.exc-finguard-detail .fg-analysis-eyebrow {
  display: inline-flex;
  align-self: flex-start;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  margin-top: 2px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #1F3B73;
  background: #E6EEFB;
  border: 1px solid #C6D5EE;
  border-radius: 999px;
}

.exc-finguard-detail .fg-section {
  margin: 0;
  padding: 10px 12px;
  background: #FFFFFF;
  border: 1px solid rgba(15, 42, 86, 0.12);
  border-left: 3px solid #1F3B73;
  border-radius: 6px;
}
.exc-finguard-detail .fg-section-h {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 6px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .01em;
  color: #0F1A33;
  text-transform: none;
}
.exc-finguard-detail .fg-section-h i {
  color: #1F3B73;
  font-size: 12px;
}
.exc-finguard-detail .fg-bullets {
  margin: 0;
  padding-left: 18px;
  list-style: disc;
}
.exc-finguard-detail .fg-bullets li {
  font-size: 13px;
  line-height: 1.55;
  color: #1F2A4A;
  margin-bottom: 4px;
}
.exc-finguard-detail .fg-bullets li:last-child {
  margin-bottom: 0;
}
.exc-finguard-detail .fg-bullets strong {
  color: #0F1A33;
  font-weight: 700;
}

/* Section-specific accents so the three AI panels are visually distinct
   without competing for attention. */
.exc-finguard-detail .fg-section:nth-of-type(1) { border-left-color: #1F3B73; }   /* root cause — navy */
.exc-finguard-detail .fg-section:nth-of-type(2) { border-left-color: #B45309; }   /* business impact — amber */
.exc-finguard-detail .fg-section:nth-of-type(2) .fg-section-h i { color: #B45309; }
.exc-finguard-detail .fg-section:nth-of-type(3) { border-left-color: #1F7A3A; }   /* suggested action — green */
.exc-finguard-detail .fg-section:nth-of-type(3) .fg-section-h i { color: #1F7A3A; }

/* ── FinGuard rules table ────────────────────────────────────────────
   The generic .aio-fld-table sets table-layout:fixed and clips its
   first column with text-overflow:ellipsis, which truncates long rule
   names. FinGuard rule tables (.aio-fg-table) opt out: rule names wrap
   onto multiple lines so reviewers always see the full rule. */
.aio-fg-table {
  table-layout: auto;
}
.aio-fg-table .aio-fg-rule {
  font-weight: 600;
  color: var(--ink);
  white-space: normal;
  word-break: break-word;
  overflow: visible;
  text-overflow: clip;
  line-height: 1.4;
  padding-right: 12px;
}
.aio-fg-table .aio-fg-sev {
  white-space: nowrap;
  font-weight: 600;
  font-size: 11.5px;
  letter-spacing: .03em;
}
.aio-fg-table .aio-fg-result {
  white-space: nowrap;
}

/* Same fix for the loanops run-summary FinGuard table. */
.run-finguard-table {
  table-layout: auto;
}
.run-finguard-table td:first-child {
  white-space: normal;
  word-break: break-word;
  overflow: visible;
  text-overflow: clip;
  line-height: 1.4;
}