.badge.attention {
  background: #fde8e5;
  color: #9b2e23;
}

.badge.active {
  background: #e5f4e9;
  color: #24633b;
}

.badge.paused,
.badge.waiting {
  background: #fff2d7;
  color: #80591d;
}

.badge.stopped {
  background: #ececec;
  color: #555;
}

.table-controls {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.table-controls label {
  color: #667069;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.header-controls {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.header-controls label {
  color: #dce9e2;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.header-controls select {
  border-color: rgba(255, 255, 255, .3);
  background: #17382a;
  color: white;
}

.product-tabs {
  display: inline-flex;
  gap: 4px;
  padding: 4px;
  border: 1px solid #ded8ca;
  border-radius: 9px;
  background: #ebe6dc;
}

.product-tab {
  min-width: 112px;
  border-color: transparent;
  background: transparent;
  color: #667069;
}

.product-tab.active {
  border-color: #d5ccba;
  background: white;
  color: #17382a;
  box-shadow: 0 2px 8px rgba(28, 36, 31, .08);
}

.tab-view[hidden] {
  display: none !important;
}

.eval-hero {
  margin: 20px 0 18px;
  padding: 26px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  border: 1px solid #c9d8cf;
  border-radius: 10px;
  background: linear-gradient(120deg, #f7fbf8, #fffaf1);
}

.eval-hero p {
  max-width: 720px;
  margin: 9px 0 0;
  color: #59665f;
  line-height: 1.55;
}

.primary-action {
  border-color: #17382a;
  background: #17382a;
  color: white;
  white-space: nowrap;
}

.eval-safety-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  padding: 20px;
}

.eval-safety-grid > div {
  padding: 16px;
  border: 1px solid #e5dfd1;
  border-radius: 8px;
  background: #faf8f3;
}

.eval-safety-grid p {
  margin: 7px 0 0;
  color: #667069;
  font-size: 13px;
  line-height: 1.5;
}

#eval-runs tr {
  cursor: pointer;
}

#eval-runs tr:hover,
#eval-runs tr.selected {
  background: #f7f4ec;
}

.badge.queued,
.badge.running,
.badge.waiting {
  background: #fff2d7;
  color: #80591d;
}

.badge.passed {
  background: #e5f4e9;
  color: #24633b;
}

.eval-evidence {
  max-width: 520px;
  white-space: pre-wrap;
  font: 11px/1.45 ui-monospace, SFMono-Regular, Menlo, monospace;
  color: #526058;
}

.email-agent-grid {
  display: grid;
  grid-template-columns: minmax(320px, .85fr) minmax(420px, 1.15fr);
  gap: 24px;
  padding: 20px;
}

.email-agent-controls {
  padding: 18px;
  border: 1px solid #e5dfd1;
  border-radius: 8px;
  background: #faf8f3;
}

.email-agent-controls input,
.email-agent-controls select,
.email-agent-controls textarea {
  width: 100%;
}

.toggle-field {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 10px;
  align-items: start;
  padding: 12px;
  border: 1px solid #e5dfd1;
  border-radius: 7px;
  background: white;
}

.toggle-field input {
  width: auto;
  margin-top: 3px;
}

.toggle-field strong,
.toggle-field small {
  display: block;
}

.toggle-field small,
.danger-card p {
  margin-top: 5px;
  color: #667069;
  line-height: 1.45;
}

.mode-choice { margin: 14px 0; padding: 12px; display: grid; gap: 9px; border: 1px solid #d5ccba; border-radius: 8px; background: white; }
.mode-choice legend { padding: 0 6px; font-size: 12px; font-weight: 750; }
.mode-choice > label { display: grid; grid-template-columns: auto 1fr; gap: 10px; padding: 12px; border: 1px solid #e5dfd1; border-radius: 7px; cursor: pointer; }
.mode-choice > label:has(input:checked) { border-color: #6f907e; background: #f1f7f3; }
.mode-choice .auto-send-choice:has(input:checked) { border-color: #b77928; background: #fff7e8; }
.mode-choice input { width: auto; margin-top: 4px; }
.mode-choice strong, .mode-choice small { display: block; }
.mode-choice small { margin-top: 4px; color: #667069; line-height: 1.4; }

.danger-card {
  margin: 0 20px 20px;
  padding: 18px;
  border: 1px solid #dca69f;
  border-radius: 8px;
  background: #fff7f5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.danger-button {
  border-color: #9b2e23;
  background: #9b2e23;
  color: white;
  white-space: nowrap;
}

.badge.drafted,
.badge.draft {
  background: #fff2d7;
  color: #80591d;
}

.badge.autonomous,
.badge.accepted {
  background: #e5f4e9;
  color: #24633b;
}

@media (max-width: 800px) {
  .email-agent-grid {
    grid-template-columns: 1fr;
  }

  .danger-card {
    align-items: flex-start;
    flex-direction: column;
  }

  .eval-hero {
    align-items: flex-start;
    flex-direction: column;
  }

  .eval-safety-grid {
    grid-template-columns: 1fr;
  }
}

tr[data-trace-intake] { cursor: pointer; }
tr[data-trace-intake]:hover { background: #faf8f3; }
.trace-run { margin: 12px 0 20px; padding: 16px; border: 1px solid #e5dfd1; border-radius: 8px; background: #faf8f3; }
.trace-run ol { margin: 14px 0 0; padding-left: 24px; }
.trace-run li { margin-bottom: 12px; }
.trace-run li > span { margin-left: 10px; color: #667069; font-size: .8rem; }
.trace-run pre { margin: 5px 0 0; white-space: pre-wrap; }
#detail details { margin-top: 18px; }
#detail summary { cursor: pointer; font-weight: 700; }

.intake-workspace-heading { margin: 20px 0 18px; display: flex; align-items: end; justify-content: space-between; gap: 24px; }
.intake-workspace-heading h2 { margin: 0; }
.intake-workspace-heading input { min-width: 260px; }
.intake-workspace { display: grid; grid-template-columns: minmax(250px, 320px) minmax(0, 1fr); gap: 18px; align-items: start; }
.intake-list-panel { position: sticky; top: 12px; max-height: calc(100vh - 30px); overflow: auto; padding: 8px; }
.intake-record-list { display: grid; gap: 6px; }
.intake-record-item { width: 100%; padding: 13px; display: grid; gap: 5px; border-color: transparent; background: transparent; color: #26382f; text-align: left; }
.intake-record-item:hover, .intake-record-item.selected { border-color: #c9d8cf; background: #f7f4ec; }
.intake-record-item > span { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.intake-record-item small { color: #667069; }
.intake-record-detail { padding: 22px; overflow: hidden; }
.empty-detail { min-height: 280px; display: grid; place-content: center; text-align: center; color: #667069; }
.empty-list { color: #667069; padding: 12px; }
.intake-detail-hero { display: flex; align-items: start; justify-content: space-between; gap: 20px; padding-bottom: 20px; border-bottom: 1px solid #e5dfd1; }
.intake-detail-hero h2 { margin: 2px 0 5px; }
.intake-summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 18px 0; }
.intake-summary-grid article { padding: 15px; border: 1px solid #e5dfd1; border-radius: 8px; background: #faf8f3; }
.intake-summary-grid h3, .record-section h3 { margin-top: 0; }
.intake-summary-grid dl { display: grid; grid-template-columns: auto 1fr; gap: 7px 12px; margin-bottom: 0; }
.intake-summary-grid dt { color: #667069; font-size: 12px; font-weight: 700; }
.intake-summary-grid dd { margin: 0; overflow-wrap: anywhere; }
.record-section { margin-top: 22px; padding-top: 20px; border-top: 1px solid #e5dfd1; }
.evidence-list { display: grid; gap: 7px; padding: 0; list-style: none; }
.evidence-list li { display: flex; gap: 12px; padding: 9px 11px; background: #faf8f3; }
.evidence-list span { color: #667069; }
.raw-record { margin-top: 24px; }
.raw-record summary { cursor: pointer; font-weight: 700; }
.raw-record pre { white-space: pre-wrap; overflow-wrap: anywhere; }

.policy-editor { display: grid; gap: 14px; margin-top: 18px; }
.policy-editor-root { display: grid; gap: 16px; margin: 16px 0; }
.collapsible-panel { padding: 0; overflow: hidden; }
.collapsible-heading { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; cursor: pointer; user-select: none; padding: 20px; margin: 0; }
.collapsible-heading:hover { background: #fbfaf6; }
.collapse-indicator { margin-left: auto; padding: 5px 10px; border: 1px solid #d8d0c0; border-radius: 999px; color: #355747; background: #f5f8f6; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.collapsible-content { padding: 0 20px 20px; }
.collapsible-panel.collapsed > .collapsible-content { display: none; }

.crm-routing-control { display: grid; grid-template-columns: minmax(260px, 1fr) auto; align-items: end; gap: 14px; margin: 2px 0 18px; padding: 16px; border: 1px solid #e5dfd1; border-radius: 9px; background: #faf8f3; }
.crm-routing-control .field-label { margin: 0; }
.crm-routing-control small { color: #667069; font-weight: 500; line-height: 1.4; }
.crm-provider-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.crm-provider-card { display: flex; flex-direction: column; gap: 9px; min-height: 170px; border-top: 3px solid #be9150; }
.crm-provider-card[data-primary="true"] { border-color: #24633b; box-shadow: 0 0 0 2px rgba(36,99,59,.12); }
.crm-provider-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.crm-provider-title strong { font-family: Georgia, serif; font-size: 17px; }
.crm-provider-card p { margin: 0; color: #536159; font-size: 12px; line-height: 1.5; }
.crm-provider-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: auto; }
.crm-provider-actions button, .crm-provider-actions a { font-size: 12px; }
.crm-provider-actions a { display: inline-flex; align-items: center; padding: 8px 11px; border: 1px solid #cfc8b7; border-radius: 6px; color: #17382a; background: white; font-weight: 700; text-decoration: none; }
.provider-health-heading { margin: 22px 0 10px; }
.provider-health-heading h3 { margin: 0; font-size: 14px; }
@media(max-width:800px){.crm-routing-control{grid-template-columns:1fr}.crm-provider-grid{grid-template-columns:1fr}}
.section-description { margin: 4px 0 0; color: #667069; font-size: 13px; }
.configuration-version-content { display: grid; grid-template-columns: minmax(220px, 1fr) 2fr; gap: 10px 18px; align-items: end; }
.configuration-version-content .configuration-meta, .configuration-version-content .button-row { grid-column: 1 / -1; }
.agent-configuration-body { display: grid; gap: 14px; }
.escalation-configuration { border: 2px solid #c98b35; background: #fffdf8; }
.escalation-heading { display: flex; justify-content: space-between; gap: 18px; align-items: flex-start; margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px solid #ead8bb; }
.escalation-heading p { margin: 4px 0 0; color: #667069; }
.visibility-label { flex: none; padding: 5px 9px; border-radius: 999px; color: #774612; background: #f8e7c9; font-size: 11px; font-weight: 800; text-transform: uppercase; }
.advanced-policy-panel textarea { width: 100%; }
.configuration-section { overflow: hidden; border: 1px solid #d8d0c0; border-radius: 9px; background: white; }
.configuration-section > summary { display: flex; align-items: center; cursor: pointer; padding: 15px 17px; color: #17382a; list-style-position: inside; }
.configuration-section > summary span { display: inline-flex; flex-direction: column; gap: 3px; margin-left: 5px; vertical-align: middle; }
.configuration-section > summary strong { font-size: 15px; }
.configuration-section > summary small { color: #667069; font-size: 12px; font-weight: 500; line-height: 1.35; }
.configuration-section[open] > summary { border-bottom: 1px solid #e5dfd1; background: #f5f8f6; }
.configuration-section-body { display: grid; gap: 14px; padding: 14px; }
.configuration-subsection { overflow: hidden; border: 1px solid #d8d0c0; border-radius: 9px; background: #fbfaf6; }
.configuration-subsection > summary { cursor: pointer; padding: 14px 16px; color: #17382a; }
.configuration-subsection > summary span { display: inline-flex; flex-direction: column; gap: 3px; margin-left: 5px; vertical-align: middle; }
.configuration-subsection > summary small { color: #667069; font-size: 12px; font-weight: 500; }
.configuration-subsection[open] > summary { border-bottom: 1px solid #e5dfd1; }
.configuration-subsection-body { display: grid; gap: 14px; padding: 16px; }
.subsection-heading { margin-top: 8px; }
.rule-list { display: grid; gap: 12px; }
.rule-card { display: grid; gap: 11px; padding: 14px; border: 1px solid #ded8ca; border-radius: 8px; background: white; }
.rule-card-heading { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.condition-list { display: grid; gap: 8px; }
.condition-row { display: grid; grid-template-columns: 1.15fr .9fr 1.5fr auto; gap: 8px; align-items: end; }
.route-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.route-card { display: grid; gap: 9px; padding: 13px; border: 1px solid #ded8ca; border-radius: 8px; background: white; }
.route-card h4 { margin: 0; text-transform: capitalize; }
@media (max-width: 900px) { .route-grid, .condition-row, .configuration-version-content { grid-template-columns: 1fr; } .escalation-heading { display: block; } .visibility-label { display: inline-block; margin-top: 9px; } }
.policy-section { padding: 17px; border: 1px solid #e5dfd1; border-radius: 9px; background: #faf8f3; }
.policy-section h3 { margin: 0; }
.friendly-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 13px; }
.full-span { grid-column: 1 / -1; }
.friendly-checks { display: flex; flex-wrap: wrap; gap: 10px 20px; margin: 13px 0; padding: 12px; border: 1px solid #ded8ca; border-radius: 7px; background: white; }
.friendly-checks legend { padding: 0 6px; color: #667069; font-size: 12px; font-weight: 700; }
.friendly-checks label, .compact-check { display: flex; align-items: center; gap: 7px; color: #526058; font-size: 13px; }
.friendly-checks input, .compact-check input { width: auto; }
.policy-list { display: grid; gap: 7px; margin-top: 13px; }
.policy-list-row { display: grid; grid-template-columns: minmax(220px, 1fr) auto auto; gap: 13px; align-items: end; padding: 10px; border: 1px solid #e5dfd1; border-radius: 7px; background: white; }
.call-path-stage-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 12px 0 18px; }
.call-path-stage-card { padding: 13px; border: 1px solid #ded8ca; border-radius: 8px; background: white; }
.call-path-stage-card .field-label { margin-bottom: 0; }
.call-path-stage-heading { display: flex; align-items: center; gap: 10px; }
.call-path-stage-heading > span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #17382a; color: white; font-size: 12px; font-weight: 800; }
.call-path-stage-heading strong { display: block; text-transform: capitalize; }
.call-path-stage-heading small { display: block; margin-top: 2px; color: #7a847e; font-size: 11px; }
.policy-question { padding: 10px; border: 1px solid #e5dfd1; border-radius: 7px; background: white; }
.policy-question span { display: flex; justify-content: space-between; gap: 12px; }
.policy-question small, .policy-section .field-label small { color: #7a847e; font-weight: 400; }
.advanced-configuration { margin: 16px 0; padding: 13px; border: 1px dashed #cfc6b5; border-radius: 8px; }
.advanced-configuration summary { cursor: pointer; font-weight: 700; }
.advanced-configuration p { color: #667069; font-size: 13px; }
.advanced-configuration textarea { width: 100%; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }

@media (max-width: 900px) {
  .intake-workspace { grid-template-columns: 1fr; }
  .intake-list-panel { position: static; max-height: 360px; }
  .intake-summary-grid { grid-template-columns: 1fr; }
  .friendly-grid, .policy-list-row, .call-path-stage-list { grid-template-columns: 1fr; }
  .intake-workspace-heading, .intake-detail-hero { align-items: stretch; flex-direction: column; }
}

#conversations-tab {
  --conversation-ink: #172b22;
  --conversation-muted: #667069;
  --conversation-line: #ded8ca;
  color: var(--conversation-ink);
}
.conversation-hero { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin: 22px 0 16px; }
.conversation-hero h2 { margin: 2px 0 5px; font-size: clamp(1.7rem, 3vw, 2.35rem); letter-spacing: -.035em; }
.conversation-hero p { max-width: 760px; margin: 0; color: var(--conversation-muted); line-height: 1.55; }
.conversation-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.conversation-metrics article { display: grid; gap: 5px; padding: 15px 17px; border: 1px solid var(--conversation-line); border-radius: 9px; background: #faf8f3; }
.conversation-metrics span { color: var(--conversation-muted); font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.conversation-metrics strong { font-size: 1.55rem; }
.conversation-toolbar { display: grid; grid-template-columns: minmax(240px, 1fr) minmax(180px, .45fr) minmax(180px, .45fr); gap: 12px; align-items: end; margin-bottom: 16px; padding: 14px; }
.conversation-toolbar .field-label { margin: 0; }
.conversation-workspace { display: grid; grid-template-columns: minmax(290px, 360px) minmax(0, 1fr); gap: 18px; align-items: start; }
.conversation-list-panel { position: sticky; top: 12px; max-height: calc(100vh - 30px); overflow: auto; padding: 8px; }
.conversation-list { display: grid; gap: 6px; }
.conversation-list-item { width: 100%; display: grid; gap: 6px; padding: 13px; border-color: transparent; background: transparent; color: var(--conversation-ink); text-align: left; }
.conversation-list-item:hover, .conversation-list-item.selected { border-color: #bdcec4; background: #f5f8f6; }
.conversation-list-title, .conversation-list-meta { display: flex; align-items: center; justify-content: space-between; gap: 9px; }
.conversation-list-item small { min-width: 0; color: var(--conversation-muted); overflow-wrap: anywhere; }
.conversation-list-meta small:last-child { flex: none; }
.conversation-detail { min-height: 440px; padding: 22px; overflow: hidden; }
.conversation-detail-hero { display: flex; align-items: start; justify-content: space-between; gap: 20px; padding-bottom: 20px; border-bottom: 1px solid var(--conversation-line); }
.conversation-detail-hero h2 { margin: 2px 0 5px; letter-spacing: -.025em; }
.conversation-detail-hero p { margin: 0; color: var(--conversation-muted); overflow-wrap: anywhere; }
.conversation-summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 18px 0; }
.conversation-summary-grid article { display: grid; gap: 6px; min-width: 0; padding: 14px; border: 1px solid var(--conversation-line); border-radius: 8px; background: #faf8f3; }
.conversation-summary-grid span { color: var(--conversation-muted); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .055em; }
.conversation-summary-grid strong, .conversation-summary-grid small { overflow-wrap: anywhere; }
.conversation-summary-grid small { color: var(--conversation-muted); line-height: 1.45; }
.conversation-actions { display: flex; justify-content: flex-end; }
.conversation-section { margin-top: 24px; padding-top: 21px; border-top: 1px solid var(--conversation-line); }
.conversation-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.conversation-section-heading h3 { margin: 2px 0 0; }
.conversation-recordings { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.conversation-recording-card { display: grid; gap: 12px; padding: 15px; border: 1px solid var(--conversation-line); border-radius: 9px; background: #faf8f3; }
.conversation-recording-card > div { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.conversation-recording-card p { margin: 4px 0 0; color: var(--conversation-muted); line-height: 1.45; }
.conversation-recording-card audio { width: 100%; min-height: 42px; }
.conversation-recording-card > small { color: var(--conversation-muted); }
.transcript-provenance { margin: 0 0 14px; padding: 10px 12px; border-radius: 7px; font-size: 13px; }
.transcript-provenance.exact { color: #24523c; background: #edf6f0; }
.transcript-provenance.fallback { color: #70491b; background: #fff4df; }
.conversation-transcript { display: grid; gap: 10px; }
.conversation-turn { width: min(84%, 720px); padding: 12px 14px; border: 1px solid var(--conversation-line); border-radius: 10px 10px 10px 2px; background: #f5f8f6; }
.conversation-turn.prospect { justify-self: end; border-radius: 10px 10px 2px 10px; background: #f7f4ec; }
.conversation-turn > div { display: flex; justify-content: space-between; gap: 14px; }
.conversation-turn > div span { color: var(--conversation-muted); font-size: 11px; text-align: right; }
.conversation-turn p { margin: 7px 0 0; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
.conversation-transcript.canonical { margin-top: 14px; }
.conversation-event-list { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.conversation-event-list li { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 14px; padding: 12px 0; border-bottom: 1px solid #eee9df; }
.conversation-event-list li > span { color: var(--conversation-muted); font-size: 12px; }
.conversation-event-list pre { margin: 7px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; }

@media (max-width: 900px) {
  .conversation-hero, .conversation-detail-hero { align-items: stretch; flex-direction: column; }
  .conversation-toolbar, .conversation-workspace, .conversation-summary-grid { grid-template-columns: 1fr; }
  .conversation-list-panel { position: static; max-height: 360px; }
  .conversation-recordings { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .conversation-metrics { grid-template-columns: 1fr; }
  .conversation-turn { width: 100%; }
  .conversation-event-list li { grid-template-columns: 1fr; gap: 4px; }
}

#call-lab-tab {
  --call-lab-font-ui: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --call-lab-font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  --call-lab-ink: #172b22;
  --call-lab-muted: #637068;
  --call-lab-line: #ded8ca;
  --call-lab-green: #123d2d;
  font-family: var(--call-lab-font-ui);
  color: var(--call-lab-ink);
}
#call-lab-tab h2, #call-lab-tab h3, #call-lab-tab button, #call-lab-tab select { font-family: var(--call-lab-font-ui); }
#call-lab-tab h2, #call-lab-tab h3 { letter-spacing: -.018em; }
#call-lab-tab button, #call-lab-tab .button-link {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 16px;
  border-radius: 8px;
  font-size: 13px;
  line-height: 1.15;
  text-align: center;
}
#call-lab-tab button:focus-visible, #call-lab-tab .button-link:focus-visible,
#call-lab-tab select:focus-visible, #call-lab-tab textarea:focus-visible,
#call-lab-tab input:focus-visible {
  outline: 3px solid rgba(190, 145, 80, .38);
  outline-offset: 2px;
}
.call-lab-hero {
  margin: 20px 0 18px;
  padding: 30px 32px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 36px;
  border: 1px solid #c8d8ce;
  border-radius: 14px;
  background: radial-gradient(circle at 88% 10%, rgba(190, 145, 80, .12), transparent 32%), linear-gradient(120deg, #f4faf6, #fffaf2);
  box-shadow: 0 12px 32px rgba(24, 50, 38, .06);
}
.call-lab-hero h2 { margin: 3px 0 8px; font-size: clamp(27px, 2.4vw, 34px); font-weight: 760; line-height: 1.08; }
.call-lab-hero p { max-width: 700px; margin: 0; color: #4f5f56; font-size: 15px; line-height: 1.62; }
.call-lab-actions { width: 438px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.call-lab-actions button { width: 100%; white-space: nowrap; }
.call-lab-actions .danger-button:disabled { border-color: #d9d3c8; background: #eeeae2; color: #8a8982; }
.call-lab-setup { border-radius: 12px; box-shadow: 0 10px 28px rgba(28, 36, 31, .055); }
.call-lab-setup > .panel-heading { min-height: 84px; }
.call-lab-mode-picker { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 22px 22px 0; }
.call-lab-mode-picker > label { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: start; min-height: 74px; padding: 15px 16px; border: 1px solid #d8d1c3; border-radius: 10px; background: #fff; cursor: pointer; transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease; }
.call-lab-mode-picker > label:hover { border-color: #9eb4a7; transform: translateY(-1px); }
.call-lab-mode-picker > label.selected { border-color: #527866; background: #f0f7f3; box-shadow: inset 0 0 0 1px #527866, 0 5px 14px rgba(39, 86, 63, .07); }
.call-lab-mode-picker input { width: auto; margin-top: 3px; accent-color: #1b6549; }
.call-lab-mode-picker strong, .call-lab-mode-picker small { display: block; }
.call-lab-mode-picker strong { font-size: 15px; }
.call-lab-mode-picker small { margin-top: 4px; color: var(--call-lab-muted); line-height: 1.4; }
.call-lab-scenario-picker { display: grid; grid-template-columns: minmax(280px, .72fr) minmax(0, 1.5fr); gap: 20px; align-items: stretch; padding: 22px 22px 0; }
.call-lab-scenario-picker > .field-label { align-self: start; margin: 4px 0 0; }
.call-lab-scenario-picker select { width: 100%; min-height: 44px; margin-top: 3px; text-overflow: ellipsis; }
.call-lab-scenario-summary { position: relative; padding: 18px 20px 18px 22px; overflow: hidden; border: 1px solid #cfddd5; border-radius: 10px; background: #f5faf7; }
.call-lab-scenario-summary::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: #4e7c66; }
.call-lab-scenario-summary h3 { margin: 5px 0 6px; font-size: 20px; }
.call-lab-scenario-summary p { margin: 7px 0 0; color: #526058; font-size: 13px; line-height: 1.5; }
.call-lab-coverage { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.call-lab-coverage span { padding: 5px 8px; border: 1px solid #cad9d0; border-radius: 999px; background: rgba(255, 255, 255, .82); color: #385646; font-size: 10px; font-weight: 800; letter-spacing: .015em; }
.call-lab-scenario-summary .call-lab-prerequisite { margin-top: 11px; padding: 9px 11px; border-left: 3px solid #bd732e; background: #fff7ee; color: #70451e; }
.call-lab-setup-grid { display: grid; grid-template-columns: minmax(0, 1.68fr) minmax(285px, .72fr); gap: 20px; align-items: stretch; padding: 22px; }
.call-lab-setup-grid > .field-label { margin: 0; }
.call-lab-setup-grid textarea { width: 100%; min-height: 310px; resize: vertical; border-color: #d7d0c2; background: #fffefa; font: 12.5px/1.58 var(--call-lab-font-mono); }
.call-lab-setup-grid .field-label small { display: block; margin-top: 7px; color: var(--call-lab-muted); font-weight: 400; line-height: 1.45; }
.call-lab-route, .call-lab-integration { padding: 20px; border: 1px solid #e1d9ca; border-radius: 10px; background: #faf8f3; }
.call-lab-route { min-height: 100%; }
.call-lab-route h3, .call-lab-integration h3 { margin: 0 0 15px; font-size: 18px; line-height: 1.12; }
.call-lab-route dl, .call-lab-integration dl { display: grid; grid-template-columns: minmax(110px, auto) minmax(0, 1fr); gap: 10px 14px; margin: 0; }
.call-lab-route dt, .call-lab-integration dt { color: var(--call-lab-muted); font-size: 11px; font-weight: 780; line-height: 1.35; }
.call-lab-route dd, .call-lab-integration dd { margin: 0; font-size: 13px; line-height: 1.35; overflow-wrap: anywhere; }
.call-lab-route p { margin: 20px 0 0; padding-top: 16px; border-top: 1px solid #e6dfd2; color: var(--call-lab-muted); font-size: 12px; line-height: 1.55; }
.call-lab-monitor-grid { display: grid; grid-template-columns: minmax(0, 1.58fr) minmax(310px, .62fr); gap: 20px; padding: 22px; }
.call-lab-speakers { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; min-height: 28px; margin-bottom: 10px; color: #526058; font-size: 11px; font-weight: 750; }
.call-lab-speakers span:last-child { margin-left: auto; }
.speaker-dot { display: inline-block; width: 9px; height: 9px; margin-right: 5px; border-radius: 50%; }
.speaker-dot.intake-agent { background: #3876ad; }
.speaker-dot.prospect-agent { background: #bd732e; }
.call-lab-transcript { min-height: 340px; max-height: 560px; overflow: auto; padding: 16px; border: 1px solid #e1d9ca; border-radius: 10px; background: #fdfdfb; }
.call-lab-line { max-width: 92%; margin: 0 0 12px; padding: 11px 13px; border-left: 4px solid #3876ad; border-radius: 0 8px 8px 0; background: #f3f8fc; font-size: 13px; line-height: 1.55; }
.call-lab-line.prospect-agent { border-left-color: #bd732e; background: #fff7ee; }
.call-lab-line strong { display: block; margin-bottom: 3px; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; }
.call-lab-error { color: #9b2e23; font-size: 12px; overflow-wrap: anywhere; }
.call-lab-evaluation { margin: 20px 0; padding-top: 18px; border-top: 1px solid #e5dfd1; }
.call-lab-evaluation h3 { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.call-lab-evaluation p { color: #667069; font-size: 12px; line-height: 1.45; }
.call-lab-evaluation ul { max-height: 260px; overflow: auto; margin: 10px 0 0; padding: 0; list-style: none; font-size: 12px; }
.call-lab-evaluation li { padding: 6px 0; border-bottom: 1px solid #eee9de; overflow-wrap: anywhere; }
.call-lab-evaluation li.passed strong { color: #26724b; }
.call-lab-evaluation li.failed strong { color: #9b2e23; }
.call-lab-evaluation li.pending strong { color: #916217; }
.call-lab-integration .button-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.call-lab-integration .button-row > * { width: 100%; }
.button-link { display: inline-block; padding: 9px 12px; border: 1px solid #cfc8b7; border-radius: 6px; background: white; color: #17382a; font-size: 13px; font-weight: 700; text-decoration: none; }
#call-lab-tab > .panel { border-radius: 12px; box-shadow: 0 8px 24px rgba(28, 36, 31, .045); }
#call-lab-tab > .panel > .panel-heading { min-height: 82px; padding: 20px 22px; }
#call-lab-tab > .panel > .panel-heading h2 { font-size: 20px; }
#call-lab-tab .eyebrow { letter-spacing: .16em; }
#call-lab-tab .configuration-meta { margin-top: 7px; }
#call-lab-tab .danger-card { margin: 0; padding: 22px; border-radius: 10px; }
#call-lab-tab .danger-card .danger-button { min-width: 250px; }
tr[data-call-lab-id] { cursor: pointer; }
tr[data-call-lab-id]:hover, tr[data-call-lab-id].selected { background: #f7f4ec; }

@media (max-width: 1080px) {
  .call-lab-hero { grid-template-columns: 1fr; gap: 22px; }
  .call-lab-actions { width: 100%; max-width: 520px; }
}

@media (max-width: 850px) {
  .call-lab-hero { align-items: flex-start; padding: 24px; }
  .call-lab-mode-picker, .call-lab-scenario-picker, .call-lab-setup-grid, .call-lab-monitor-grid { grid-template-columns: 1fr; }
  .call-lab-route dl, .call-lab-integration dl { grid-template-columns: minmax(125px, .7fr) minmax(0, 1fr); }
  .call-lab-setup > .panel-heading { flex-direction: row; align-items: center; }
}

@media (max-width: 650px) {
  header .with-help { flex-wrap: nowrap; align-items: flex-start; }
  header h1 { font-size: 26px; line-height: 1.13; }
  main { margin-top: 18px; padding: 0 16px; }
  .product-tabs { width: 100%; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .product-tab { min-width: 0; padding: 9px 5px; font-size: 12px; }
  #call-lab-tab .with-help { width: 100%; display: grid; grid-template-columns: minmax(0, auto) 19px; justify-content: start; align-items: center; }
  #call-lab-tab .configuration-meta { height: auto; min-height: 34px; flex-wrap: wrap; line-height: 1.45; }
  .call-lab-hero { padding: 22px 20px; border-radius: 12px; }
  .call-lab-hero h2 { font-size: 27px; }
  .call-lab-hero p { font-size: 14px; line-height: 1.56; }
  .call-lab-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .call-lab-actions #call-lab-listen { grid-column: 1 / -1; }
  .call-lab-actions button { white-space: normal; }
  #call-lab-tab > .panel > .panel-heading { min-height: 0; padding: 18px; }
  .call-lab-setup > .panel-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; }
  .call-lab-mode-picker, .call-lab-scenario-picker, .call-lab-setup-grid, .call-lab-monitor-grid { padding: 18px; }
  .call-lab-mode-picker { gap: 10px; }
  .call-lab-mode-picker > label { min-height: 0; }
  .call-lab-scenario-picker { gap: 16px; padding-top: 18px; }
  .call-lab-setup-grid { padding-top: 2px; }
  .call-lab-setup-grid textarea { min-height: 300px; }
  .call-lab-route dl, .call-lab-integration dl { grid-template-columns: 1fr; gap: 4px; }
  .call-lab-route dd, .call-lab-integration dd { margin-bottom: 9px; }
  .call-lab-monitor-grid { gap: 16px; }
  .call-lab-speakers span:last-child { width: 100%; margin-left: 0; }
  .call-lab-transcript { min-height: 300px; }
  .call-lab-line { max-width: 100%; }
  .call-lab-integration .button-row { grid-template-columns: 1fr; }
  #call-lab-tab .danger-card { align-items: stretch; padding: 20px; }
  #call-lab-tab .danger-card .danger-button { width: 100%; min-width: 0; }
}
