@font-face{font-family:Geist;src:url('/geist.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:'Geist Mono';src:url('/geist-mono.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:'Instrument Serif';src:url('/instrument-serif.woff2') format('woff2');font-weight:400;font-display:swap}
:root {
  --bg:#f8f9fb;
  --surface:#fff;
  --ink:#111318;
  --muted:#606978;
  --line:#e5e7eb;
  --teal:#2563eb;
  --teal-light:#eef4ff;
  --amber:#a66c1b;
  --amber-light:#fbf2dd;
  --red:#ab4940;
  --red-light:#fbeeea;
  --shadow:0 4px 24px #26392b05;
  --radius:12px;
  font-family:'Geist',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  color:var(--ink);
  font-size:14px;
  font-synthesis:none
}
* {
  box-sizing:border-box
}
body {
  margin:0;
  background:var(--bg)
}
button,input,select,textarea {
  font:inherit
}
button,a,input,select,textarea {
  -webkit-tap-highlight-color:transparent
}
button,a {
  touch-action:manipulation
}
button {
  cursor:pointer
}
button:disabled {
  cursor:wait;
  opacity:.55
}
a {
  color:var(--teal);
  text-decoration:none
}
button:focus-visible,a:focus-visible {
  outline:3px solid #2563eb;
  outline-offset:3px
}
input:focus,textarea:focus,select:focus {
  outline:2px solid #2563eb;
  outline-offset:1px
}
button {
  color:inherit
}
h1,h2,h3,h4,p {
  margin:0
}
h1,h2,h3,h4,.brand {
  font-family:'Geist',sans-serif
}
h1 {
  font-size:28px;
  font-weight:750;
  letter-spacing:-1px;
  line-height:1.25
}
h2 {
  font-size:16px;
  letter-spacing:-.3px;
  font-weight:750
}
h3 {
  font-size:14px;
  font-weight:750
}
h4 {
  font-size:13px
}
p {
  line-height:1.6
}
svg {
  width:19px;
  height:19px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.65;
  stroke-linecap:round;
  stroke-linejoin:round;
  flex-shrink:0
}
.shell {
  min-height:100vh;
  display:grid;
  grid-template-columns:222px minmax(0,1fr)
}
.sidebar {
  position:fixed;
  inset:0 auto 0 0;
  width:222px;
  background:#fff;
  border-right:1px solid var(--line);
  padding:31px 18px 18px;
  display:flex;
  flex-direction:column;
  z-index:20
}
.brand {
  display:flex;
  align-items:center;
  gap:11px;
  padding:0 12px;
  font-size:20px;
  font-weight:800;
  letter-spacing:-.8px
}
.brand-mark {
  width:33px;
  height:33px;
  background:var(--teal);
  border-radius:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:white;
  font-family:'Geist',sans-serif;
  font-size:24px;
  font-weight:700;
  letter-spacing:-6px;
  padding-right:7px;
  flex-shrink:0
}
.brand-mark span {
  font-weight:400
}
.workspace-picker {
  margin:31px 5px 29px;
  border:1px solid var(--line);
  border-radius:9px;
  background:#fff;
  padding:10px;
  display:flex;
  gap:9px;
  align-items:center
}
.workspace-icon {
  display:grid;
  place-items:center;
  background:#f3eee2;
  border:1px solid #e9e0ce;
  color:#896d43;
  width:31px;
  height:31px;
  border-radius:7px
}
.workspace-picker select {
  width:127px;
  border:0;
  background:none;
  font-size:12px;
  font-weight:650;
  color:var(--ink);
  outline:0
}
.workspace-caption {
  font-size:10px;
  color:var(--muted);
  padding-left:4px
}
.nav-label {
  padding:0 14px;
  margin-bottom:12px;
  font-size:10px;
  color:#8a948e;
  text-transform:uppercase;
  letter-spacing:1.25px;
  font-weight:700
}
.nav {
  display:flex;
  flex-direction:column;
  gap:5px
}
.nav a {
  display:flex;
  align-items:center;
  gap:12px;
  border-radius:8px;
  padding:11px 14px;
  color:#768078;
  font-size:13px;
  font-weight:550
}
.nav a.active {
  background:#eef4ff;
  color:var(--teal);
  font-weight:700
}
.nav a:hover {
  background:#f3f5f8
}
.nav a .count {
  margin-left:auto;
  background:#fff;
  padding:1px 6px;
  border-radius:4px;
  font-size:10px;
  color:var(--teal)
}
.sidebar-bottom {
  margin-top:auto
}
.agent-health {
  margin:25px 7px 18px;
  border:1px solid var(--line);
  padding:12px;
  border-radius:9px;
  background:#fff
}
.health-top {
  display:flex;
  align-items:center;
  gap:7px;
  font-size:11px;
  font-weight:650
}
.status-dot {
  width:6px;
  height:6px;
  background:#368d66;
  border-radius:50%;
  display:inline-block;
  box-shadow:0 0 0 3px #368d6610;
  flex-shrink:0
}
.status-dot.off {
  background:#ba7340
}
.health-caption {
  color:var(--muted);
  font-size:10px;
  margin-top:5px;
  line-height:1.6
}
.profile {
  display:flex;
  align-items:center;
  gap:9px;
  border-top:1px solid var(--line);
  padding:18px 8px 0;
  font-size:11px
}
.profile .avatar {
  width:31px;
  height:31px;
  background:#eef2f7
}
.profile strong {
  font-size:11px
}
.profile small {
  display:block;
  color:var(--muted);
  margin-top:3px
}
.main {
  grid-column:2;
  min-width:0
}
.topbar {
  height:76px;
  border-bottom:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  padding:0 37px;
  background:#fff
}
.breadcrumb {
  font-size:12px;
  color:var(--muted);
  display:flex;
  align-items:center;
  gap:12px
}
.breadcrumb strong {
  font-weight:550;
  color:#4e5c53
}
.topbar-right {
  display:flex;
  align-items:center;
  gap:16px
}
.badge {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 8px;
  border:1px solid #dbe7fd;
  border-radius:5px;
  color:var(--teal);
  background:#eff6ff;
  font-size:10px;
  font-weight:650;
  white-space:nowrap
}
.badge.amber {
  color:var(--amber);
  background:var(--amber-light);
  border-color:#f2e7c9
}
.badge.gray {
  color:#7c847f;
  background:#f3f5f1;
  border-color:var(--line)
}
.badge.red {
  color:var(--red);
  background:var(--red-light);
  border-color:#f2d9d3
}
.top-date {
  color:var(--muted);
  font-size:11px
}
.icon-button {
  border:0;
  background:none;
  padding:6px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:6px
}
.icon-button:hover {
  background:#eef4ff
}
.mobile-menu {
  display:none
}
.page {
  padding:31px 37px 36px;
  max-width:1550px;
  margin:auto
}
.page-heading {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  margin-bottom:27px
}
.eyebrow {
  text-transform:uppercase;
  letter-spacing:1.6px;
  font-size:9px;
  color:#80917f;
  margin-bottom:8px;
  font-weight:700
}
.subtitle {
  font-size:12px;
  color:var(--muted);
  margin-top:7px
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:36px;
  border:1px solid var(--line);
  border-radius:7px;
  background:#fff;
  font-size:11px;
  font-weight:650;
  padding:9px 13px;
  line-height:1.4;
  white-space:nowrap
}
.button svg {
  width:15px;
  height:15px
}
.button.primary {
  background:var(--teal);
  border-color:var(--teal);
  color:#fff
}
.button.primary:hover {
  background:#085647
}
.button:hover {
  border-color:#becfc3
}
.button.small {
  padding:6px 9px;
  min-height:29px;
  font-size:10px
}
.button.danger {
  color:var(--red)
}
.button.ghost {
  background:transparent;
  border-color:transparent;
  color:var(--muted)
}
.actions {
  display:flex;
  align-items:center;
  gap:9px;
  flex-wrap:wrap
}
.demo-banner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:13px 17px;
  border:1px solid #dee9dc;
  background:#edf3e9;
  border-radius:9px;
  margin-bottom:24px;
  font-size:11px;
  color:#63775d
}
.demo-banner strong {
  color:#3c5f45;
  font-weight:650
}
.demo-banner svg {
  width:16px;
  height:16px
}
.demo-banner .banner-copy {
  display:flex;
  align-items:center;
  gap:11px
}
.metrics {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:15px;
  margin-bottom:25px
}
.metric {
  border:1px solid var(--line);
  background:var(--surface);
  padding:18px;
  border-radius:var(--radius);
  box-shadow:var(--shadow)
}
.metric-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:5px;
  color:#7b867d;
  font-size:11px
}
.metric-icon {
  background:#f4f6f1;
  border-radius:7px;
  color:#7d907c;
  width:29px;
  height:29px;
  display:grid;
  place-items:center
}
.metric-icon svg {
  width:15px;
  height:15px
}
.metric-value {
  font-family:'Geist',sans-serif;
  letter-spacing:-1px;
  font-size:29px;
  font-weight:750;
  margin-top:8px
}
.metric-caption {
  font-size:10px;
  color:#8c958c;
  margin-top:8px
}
.metric-caption.good {
  color:#50836a
}
.dashboard-grid {
  display:grid;
  grid-template-columns:minmax(0,1.6fr) minmax(280px,1fr);
  gap:21px
}
.stack {
  display:flex;
  flex-direction:column;
  gap:21px
}
.card {
  border:1px solid var(--line);
  background:#fff;
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  min-width:0;
  overflow:hidden
}
.card-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:20px 21px 16px
}
.card-header p {
  color:var(--muted);
  font-size:10px;
  margin-top:5px
}
.text-link {
  font-size:10px;
  color:var(--teal);
  font-weight:650;
  display:inline-flex;
  align-items:center;
  gap:6px
}
.text-link svg {
  width:13px;
  height:13px
}
.table-wrap {
  overflow:auto
}
table {
  border-collapse:collapse;
  width:100%;
  text-align:left
}
th {
  font-size:9px;
  font-weight:600;
  letter-spacing:.4px;
  color:#939c94;
  background:#fff;
  border-top:1px solid #f0f2ed;
  border-bottom:1px solid #f0f2ed;
  padding:11px 21px;
  white-space:nowrap
}
td {
  padding:16px 21px;
  border-bottom:1px solid #f0f2ed;
  font-size:11px
}
tr:last-child td {
  border-bottom:0
}
.person {
  display:flex;
  align-items:center;
  gap:9px
}
.avatar {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:31px;
  height:31px;
  border-radius:50%;
  font-size:10px;
  font-weight:700;
  color:#66715d;
  background:#edf0e6;
  flex-shrink:0
}
.avatar.color1 {
  background:#e9e8f3;
  color:#817494
}
.avatar.color2 {
  background:#faeee2;
  color:#ad8864
}
.avatar.color3 {
  background:#e4efec;
  color:#578678
}
.person strong {
  display:block;
  font-size:11px;
  font-weight:650
}
.person small {
  display:block;
  font-size:9px;
  color:var(--muted);
  margin-top:4px
}
.cell-title {
  font-size:11px;
  font-weight:550;
  max-width:200px
}
.cell-sub {
  font-size:9px;
  color:var(--muted);
  margin-top:5px
}
.due {
  font-size:10px;
  color:#8c947e;
  white-space:nowrap
}
.due.overdue {
  color:#b27939
}
.card-footer {
  padding:12px 21px;
  border-top:1px solid var(--line);
  background:#fdfefa;
  font-size:9px;
  color:var(--muted);
  display:flex;
  align-items:center;
  gap:6px
}
.timeline {
  padding:0 21px 6px
}
.timeline-item {
  display:flex;
  gap:11px;
  padding:13px 0;
  position:relative
}
.timeline-item:not(:last-child):before {
  content:'';
  position:absolute;
  width:1px;
  top:35px;
  bottom:-11px;
  left:13px;
  background:var(--line)
}
.event-icon {
  width:27px;
  height:27px;
  border:1px solid #e6ece3;
  border-radius:50%;
  background:#f4f8f1;
  color:#7b9074;
  display:grid;
  place-items:center;
  flex-shrink:0
}
.event-icon svg {
  width:12px;
  height:12px
}
.timeline-copy {
  min-width:0;
  flex:1
}
.timeline-copy p {
  font-size:11px;
  font-weight:500
}
.timeline-copy small {
  font-size:9px;
  color:var(--muted);
  display:block;
  margin-top:4px;
  line-height:1.6;
  overflow-wrap:anywhere
}
.timeline-time {
  font-size:9px;
  white-space:nowrap;
  color:#98a194;
  margin-top:2px
}
.approval-preview {
  margin:0 20px 18px;
  background:#fafbf7;
  border:1px solid var(--line);
  border-radius:9px;
  padding:14px
}
.approval-preview p {
  font-size:11px;
  line-height:1.7;
  margin:10px 0 14px;
  color:#687165
}
.approval-preview .person {
  margin-bottom:10px
}
.assistant-card {
  background:#eaf0e4;
  border:1px solid #dfe9d8;
  padding:20px;
  border-radius:var(--radius)
}
.assistant-heading {
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:9px;
  font-weight:700;
  font-size:12px;
  color:#3f694d
}
.assistant-card p {
  font-size:11px;
  color:#738268;
  line-height:1.8
}
.assistant-card .text-link {
  margin-top:15px
}
.small-label {
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:1px;
  color:#8c978a
}
.empty {
  padding:38px 24px;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  color:var(--muted);
  gap:10px
}
.empty .empty-icon {
  width:42px;
  height:42px;
  border:1px solid var(--line);
  border-radius:12px;
  display:grid;
  place-items:center;
  color:#8eac96;
  background:#f8faf5
}
.empty strong {
  font-size:12px;
  color:#56674f
}
.empty p {
  max-width:350px;
  font-size:11px
}
.error-banner {
  padding:12px 17px;
  margin-bottom:18px;
  background:var(--red-light);
  border:1px solid #efd2c9;
  border-radius:8px;
  color:var(--red);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  font-size:12px
}
.inbox-shell {
  display:grid;
  grid-template-columns:245px minmax(300px,1fr) 265px;
  height:calc(100vh - 162px);
  min-height:560px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
  overflow:hidden
}
.inbox-list {
  border-right:1px solid var(--line);
  display:flex;
  flex-direction:column;
  min-height:0
}
.list-header {
  padding:18px 17px 14px
}
.list-header h2 {
  font-size:14px
}
.search {
  position:relative;
  margin-top:13px
}
.search input {
  width:100%;
  background:#f7f9f4;
  border:1px solid var(--line);
  border-radius:6px;
  padding:9px 10px 9px 31px;
  font-size:11px
}
.search svg {
  position:absolute;
  top:10px;
  left:10px;
  width:13px;
  height:13px;
  color:#8c9988
}
.customer-list {
  overflow-y:auto
}
.customer-row {
  display:flex;
  align-items:flex-start;
  gap:10px;
  width:100%;
  text-align:left;
  background:none;
  border:0;
  border-top:1px solid #f1f3ed;
  padding:16px
}
.customer-row.selected {
  background:#edf4eb;
  border-left:3px solid var(--teal);
  padding-left:13px
}
.customer-row:hover {
  background:#f5f8f1
}
.customer-row-copy {
  flex:1;
  min-width:0
}
.customer-row strong {
  font-size:11px
}
.customer-row p {
  font-size:10px;
  color:var(--muted);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  margin-top:5px
}
.customer-row small {
  font-size:9px;
  display:block;
  color:#8b9a85;
  margin-top:7px
}
.conversation {
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:0;
  background:#fcfdf9
}
.conversation-head {
  padding:16px 20px;
  background:#fff;
  border-bottom:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px
}
.conversation-head .person strong {
  font-size:12px
}
.conversation-head .person small {
  font-size:10px
}
.messages {
  overflow:auto;
  flex:1;
  padding:22px;
  display:flex;
  flex-direction:column;
  gap:16px
}
.message-day {
  text-align:center;
  text-transform:uppercase;
  color:#a2aa9d;
  font-size:8px;
  letter-spacing:1px;
  margin:2px 0 5px
}
.message {
  max-width:88%;
  align-self:flex-start
}
.message.outbound {
  align-self:flex-end
}
.message.internal {
  align-self:center;
  max-width:95%;
  width:100%
}
.message-label {
  font-size:9px;
  color:#8f9b87;
  margin:0 4px 5px;
  display:flex;
  align-items:center;
  gap:5px
}
.message.outbound .message-label {
  justify-content:flex-end
}
.bubble {
  font-size:12px;
  line-height:1.75;
  padding:12px 14px;
  border-radius:0 10px 10px 10px;
  border:1px solid #e6ebe0;
  background:#fff;
  white-space:pre-wrap;
  overflow-wrap:anywhere
}
.outbound .bubble {
  background:#e8f2e7;
  border-color:#dce8d8;
  border-radius:10px 0 10px 10px
}
.internal .bubble {
  background:#f4f0e5;
  border-color:#e9e2cf;
  font-size:10px;
  text-align:center;
  border-radius:6px;
  color:#847a5f
}
.message-meta {
  display:flex;
  gap:6px;
  justify-content:flex-end;
  font-size:8px;
  color:#a0aa98;
  margin-top:5px
}
.message-meta .failed {
  color:var(--red)
}
.composer-area {
  background:#fff;
  border-top:1px solid var(--line);
  padding:14px 19px
}
.mode-note {
  font-size:10px;
  color:#7e8d74;
  margin-bottom:10px;
  display:flex;
  align-items:center;
  gap:6px
}
.mode-note svg {
  height:13px;
  width:13px
}
.composer {
  border:1px solid #dbe4d6;
  border-radius:8px;
  padding:9px;
  background:#fefefc
}
.composer textarea {
  border:0;
  background:none;
  resize:vertical;
  min-height:51px;
  max-height:180px;
  width:100%;
  font-size:12px;
  line-height:1.5;
  padding:3px;
  outline:0
}
.composer-footer {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  font-size:9px;
  color:#94a18b
}
.customer-panel {
  padding:20px 18px;
  border-left:1px solid var(--line);
  overflow:auto
}
.panel-section {
  padding-bottom:21px;
  margin-bottom:21px;
  border-bottom:1px solid var(--line)
}
.panel-section:last-child {
  border-bottom:0;
  margin-bottom:0
}
.panel-title {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:13px
}
.panel-title h3 {
  font-size:11px
}
.panel-title svg {
  height:14px;
  width:14px
}
.detail-row {
  display:flex;
  justify-content:space-between;
  gap:10px;
  font-size:10px;
  margin:10px 0;
  color:var(--muted)
}
.detail-row strong {
  font-weight:500;
  color:#5b6d52
}
.memory {
  background:#f7f9f2;
  border:1px solid #e8eddf;
  border-radius:7px;
  padding:10px;
  margin-top:8px
}
.memory strong {
  font-size:9px;
  font-weight:600;
  color:#8b987c;
  text-transform:capitalize
}
.memory p {
  font-size:11px;
  color:#5b6c51;
  margin-top:4px;
  overflow-wrap:anywhere
}
.commitment-mini {
  border:1px solid var(--line);
  border-radius:8px;
  padding:11px;
  margin-top:8px
}
.commitment-mini h4 {
  font-size:11px;
  line-height:1.5;
  margin-bottom:8px
}
.commitment-mini small {
  display:block;
  color:var(--muted);
  font-size:9px;
  margin:7px 0
}
.commitment-mini select {
  width:100%;
  font-size:10px;
  border:1px solid var(--line);
  border-radius:5px;
  padding:5px;
  background:#fafbf7;
  color:#687a5c;
  margin-top:7px
}
.consent-label {
  display:flex;
  align-items:center;
  gap:8px;
  font-size:10px;
  line-height:1.5
}
.consent-label input {
  accent-color:var(--teal)
}
.route-inbox .page {
  max-width:none;
  padding:25px 25px 24px
}
.route-inbox .page-heading {
  margin-bottom:20px
}
.route-inbox h1 {
  font-size:24px
}
.route-inbox .subtitle {
  margin-top:5px
}
.settings-grid {
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:23px
}
.card-body {
  padding:0 22px 22px
}
.form-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:17px
}
.field {
  display:flex;
  flex-direction:column;
  gap:7px;
  margin-bottom:17px
}
.form-grid .field {
  margin-bottom:0
}
.field.full {
  grid-column:1/-1
}
.field label {
  font-size:11px;
  font-weight:650;
  color:#5d6f53
}
.field input,.field textarea,.field select {
  width:100%;
  border:1px solid #dfe5d8;
  background:#fff;
  border-radius:7px;
  padding:10px 11px;
  color:#45583b;
  font-size:12px
}
.field textarea {
  min-height:96px;
  resize:vertical;
  line-height:1.7
}
.field small {
  font-size:10px;
  color:#8b9880;
  line-height:1.6
}
.form-actions {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  margin-top:21px;
  padding-top:18px;
  border-top:1px solid var(--line)
}
.integration-step {
  padding:15px 0;
  border-bottom:1px solid var(--line);
  display:flex;
  gap:12px
}
.step-number {
  width:23px;
  height:23px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#f1f5e9;
  font-size:10px;
  color:#819270;
  flex-shrink:0
}
.integration-step strong {
  font-size:11px
}
.integration-step p {
  font-size:11px;
  color:var(--muted);
  margin-top:5px;
  line-height:1.8
}
.integration-step:last-child {
  border-bottom:0
}
.code-value {
  font-family:ui-monospace,SFMono-Regular,monospace;
  font-size:10px;
  background:#f5f7f0;
  border:1px solid var(--line);
  padding:10px;
  border-radius:6px;
  overflow-wrap:anywhere;
  line-height:1.7;
  margin-top:10px;
  color:#657957
}
.notice {
  border:1px solid #eadfc7;
  background:#fbf6e9;
  border-radius:8px;
  padding:13px 15px;
  font-size:11px;
  line-height:1.7;
  color:#92805b
}
.notice.teal {
  border-color:#d7e5d4;
  background:#f2f7ed;
  color:#718263
}
.playbook-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:21px
}
.playbook-card {
  padding:22px
}
.playbook-top {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:15px;
  margin-bottom:14px
}
.playbook-card h2 {
  font-size:15px;
  margin:14px 0 8px
}
.playbook-card p {
  font-size:12px;
  color:var(--muted);
  line-height:1.8;
  white-space:pre-wrap;
  overflow-wrap:anywhere
}
.playbook-meta {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:20px;
  padding-top:15px;
  border-top:1px solid var(--line)
}
.switch {
  width:30px;
  height:17px;
  border:0;
  border-radius:12px;
  background:#dce5d5;
  position:relative;
  padding:0
}
.switch:after {
  content:'';
  position:absolute;
  top:3px;
  left:3px;
  width:11px;
  height:11px;
  border-radius:50%;
  background:white;
  box-shadow:0 1px 3px #0002
}
.switch.on {
  background:var(--teal)
}
.switch.on:after {
  left:16px
}
.approval-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px
}
.approval-card {
  padding:22px
}
.approval-card .approval-copy {
  padding:16px;
  background:#f7f9f2;
  border:1px solid var(--line);
  border-radius:8px;
  font-size:12px;
  line-height:1.8;
  white-space:pre-wrap;
  margin:17px 0
}
.approval-card .actions {
  justify-content:flex-end
}
.activity-layout {
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);
  gap:22px
}
.toolbar {
  display:flex;
  gap:10px;
  align-items:center;
  margin-bottom:20px
}
.toolbar select {
  border:1px solid var(--line);
  border-radius:6px;
  background:white;
  padding:8px 12px;
  font-size:11px;
  color:var(--muted)
}
.full-table td {
  padding:16px 20px
}
.job-error {
  font-size:10px;
  color:var(--red);
  max-width:260px;
  overflow-wrap:anywhere;
  margin-top:7px
}
.toast-region {
  position:fixed;
  right:26px;
  bottom:24px;
  display:flex;
  flex-direction:column;
  gap:8px;
  z-index:100
}
.toast {
  background:#24382c;
  color:#fff;
  border-radius:9px;
  box-shadow:0 6px 30px #192a2520;
  padding:13px 17px;
  font-size:12px;
  max-width:400px;
  animation:slide .2s ease-out
}
.toast.error {
  background:#8c463a
}
.modal-backdrop {
  position:fixed;
  inset:0;
  background:#14281d66;
  backdrop-filter:blur(3px);
  z-index:70;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  overflow:auto
}
.modal {
  max-width:520px;
  width:100%;
  max-height:calc(100vh - 40px);
  overflow:auto;
  background:#fff;
  border-radius:14px;
  box-shadow:0 20px 80px #14281d33
}
.modal-header {
  padding:22px 24px 17px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid var(--line)
}
.modal-header h2 {
  font-size:17px
}
.modal-body {
  padding:23px
}
.modal .form-actions {
  margin-bottom:0
}
.initial-load {
  min-height:100vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:20px;
  color:var(--muted);
  font-size:12px
}
.initial-load .brand-mark {
  width:46px;
  height:46px;
  border-radius:13px;
  font-size:33px
}
.loading-bar {
  height:2px;
  position:fixed;
  top:0;
  left:0;
  background:var(--teal);
  z-index:90;
  animation:load 1.4s infinite;
  width:30%
}
.login-screen {
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:radial-gradient(at 70% 20%,#e6eedf,transparent 55%),var(--bg)
}
.login-card {
  width:390px;
  padding:34px;
  border:1px solid var(--line);
  border-radius:17px;
  background:#fff;
  box-shadow:0 15px 70px #3b563014
}
.login-card .brand {
  padding:0;
  margin-bottom:34px
}
.login-card h1 {
  font-size:24px
}
.login-card p {
  font-size:12px;
  color:var(--muted);
  margin:12px 0 24px
}
.login-card .button {
  width:100%
}
.login-caption {
  font-size:10px;
  color:#8f9b85;
  line-height:1.7;
  margin-top:16px
}
.footer-note {
  margin-top:24px;
  font-size:10px;
  color:#99a18f;
  display:flex;
  align-items:center;
  justify-content:space-between
}
.helper {
  font-size:10px;
  color:var(--muted);
  line-height:1.7
}
.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0
}
.scenario-options {
  display:flex;
  flex-direction:column;
  gap:11px
}
.scenario-option {
  border:1px solid var(--line);
  border-radius:9px;
  text-align:left;
  background:#f8f9fb;
  padding:16px;
  display:flex;
  align-items:center;
  gap:14px
}
.scenario-option:hover {
  border-color:#96b689;
  background:#f2f7ed
}
.scenario-option svg {
  color:var(--teal)
}
.scenario-option strong {
  display:block;
  font-size:12px
}
.scenario-option p {
  font-size:11px;
  color:var(--muted);
  margin-top:5px
}
.scenario-option .arrow {
  margin-left:auto
}
@keyframes slide {
  from {
    transform:translateY(8px);
    opacity:0
  }
  to {
    transform:none;
    opacity:1
  }
}
@keyframes load {
  from {
    transform:translateX(-100%)
  }
  to {
    transform:translateX(400%)
  }
}
@media(min-width:1600px) {
  .dashboard-grid {
    grid-template-columns:minmax(0,1.8fr) minmax(330px,1fr)
  }
  .inbox-shell {
    grid-template-columns:290px minmax(380px,1fr) 310px
  }
}
@media(max-width:1250px) {
  .sidebar {
    width:195px;
    padding-left:12px;
    padding-right:12px
  }
  .shell {
    grid-template-columns:195px minmax(0,1fr)
  }
  .workspace-picker select {
    width:112px
  }
  .page {
    padding:27px
  }
  .topbar {
    padding:0 27px
  }
  .dashboard-grid {
    grid-template-columns:minmax(0,1.5fr) minmax(260px,1fr)
  }
  td,th {
    padding-left:16px;
    padding-right:16px
  }
  .inbox-shell {
    grid-template-columns:210px minmax(270px,1fr)
  }
  .customer-panel {
    grid-column:1/-1;
    border-left:0;
    border-top:1px solid var(--line);
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
    overflow:visible
  }
  .inbox-shell {
    height:auto;
    min-height:0
  }
  .inbox-list,.conversation {
    height:620px
  }
  .customer-panel .panel-section {
    border:0;
    padding:0;
    margin:0
  }
  .route-inbox .page {
    padding:25px
  }
  .top-date {
    display:none
  }
}
@media(max-width:1000px) {
  .shell {
    grid-template-columns:174px minmax(0,1fr)
  }
  .sidebar {
    width:174px
  }
  .brand {
    font-size:18px;
    padding:0 8px;
    gap:8px
  }
  .workspace-picker {
    padding:8px;
    margin-left:0;
    margin-right:0
  }
  .workspace-picker select {
    width:99px
  }
  .workspace-icon {
    display:none
  }
  .nav a {
    padding:10px 12px;
    font-size:12px
  }
  .metrics {
    gap:10px
  }
  .metric {
    padding:14px
  }
  .metric-top {
    font-size:10px
  }
  .metric-icon {
    display:none
  }
  .metric-value {
    font-size:26px
  }
  .dashboard-grid,.settings-grid,.activity-layout {
    grid-template-columns:1fr
  }
  .dashboard-grid>.stack {
    display:grid;
    grid-template-columns:1fr 1fr;
    align-items:start
  }
  .dashboard-grid>.stack .assistant-card {
    grid-column:1/-1
  }
  .card-header {
    padding:18px
  }
  .playbook-grid,.approval-grid {
    gap:15px
  }
  .playbook-card,.approval-card {
    padding:18px
  }
  .page-heading h1 {
    font-size:25px
  }
  .demo-banner .button {
    display:none
  }
}
@media(max-width:740px) {
  .shell {
    display:block
  }
  .sidebar {
    transform:translateX(-100%);
    transition:transform .2s;
    width:222px;
    box-shadow:15px 0 50px #20302220
  }
  .sidebar.open {
    transform:none
  }
  .sidebar.open .workspace-picker select {
    width:128px
  }
  .sidebar.open .workspace-icon {
    display:grid
  }
  .main {
    width:100%
  }
  .topbar {
    height:60px;
    padding:0 18px
  }
  .mobile-menu {
    display:inline-flex
  }
  .breadcrumb {
    gap:8px
  }
  .topbar-right {
    gap:8px
  }
  .topbar-right .button {
    font-size:10px;
    padding:6px 8px;
    min-height:30px
  }
  .page {
    padding:25px 18px
  }
  .page-heading {
    align-items:flex-start;
    margin-bottom:22px
  }
  .page-heading h1 {
    font-size:24px
  }
  .page-heading>.actions .button {
    font-size:10px;
    padding:8px
  }
  .page-heading .subtitle {
    font-size:11px;
    max-width:245px
  }
  .eyebrow {
    font-size:8px
  }
  .metrics {
    grid-template-columns:repeat(2,1fr);
    gap:11px;
    margin-bottom:20px
  }
  .metric {
    padding:15px
  }
  .metric-icon {
    display:grid
  }
  .metric-value {
    font-size:28px
  }
  .demo-banner {
    font-size:10px;
    padding:12px;
    margin-bottom:20px
  }
  .dashboard-grid {
    gap:18px
  }
  .dashboard-grid>.stack {
    display:flex
  }
  .dashboard-grid .card-header {
    padding:18px
  }
  .dashboard-grid th,.dashboard-grid td {
    padding:12px
  }
  .dashboard-grid th:last-child,.dashboard-grid td:last-child {
    display:none
  }
  .dashboard-grid .person .avatar {
    display:none
  }
  .dashboard-grid .person strong {
    font-size:10px
  }
  .card-header h2 {
    font-size:14px
  }
  .route-inbox .page {
    padding:22px 12px
  }
  .inbox-shell {
    grid-template-columns:1fr;
    overflow:hidden
  }
  .inbox-list {
    height:auto;
    border-right:0;
    border-bottom:1px solid var(--line)
  }
  .list-header {
    padding:13px
  }
  .list-header h2 {
    display:none
  }
  .search {
    margin-top:0
  }
  .customer-list {
    display:flex;
    overflow-x:auto
  }
  .customer-row {
    min-width:170px;
    width:170px;
    border-right:1px solid var(--line);
    padding:12px
  }
  .customer-row.selected {
    border-left:0;
    border-bottom:2px solid var(--teal);
    padding-left:12px
  }
  .customer-row p {
    max-width:110px
  }
  .customer-row .avatar {
    width:26px;
    height:26px;
    font-size:8px
  }
  .customer-row small {
    display:none
  }
  .conversation {
    height:600px
  }
  .conversation-head {
    padding:13px
  }
  .conversation-head .button {
    font-size:9px;
    padding:7px
  }
  .messages {
    padding:17px
  }
  .customer-panel {
    display:block;
    padding:20px
  }
  .customer-panel .panel-section {
    padding-bottom:20px;
    margin-bottom:20px;
    border-bottom:1px solid var(--line)
  }
  .customer-panel .panel-section:last-child {
    margin-bottom:0;
    border:0;
    padding:0
  }
  .playbook-grid,.approval-grid {
    grid-template-columns:1fr
  }
  .settings-grid {
    gap:19px
  }
  .form-grid {
    grid-template-columns:1fr
  }
  .field.full {
    grid-column:auto
  }
  .footer-note {
    font-size:9px
  }
  .footer-note span:last-child {
    display:none
  }
  .toast-region {
    right:15px;
    left:15px;
    bottom:16px
  }
  .toast {
    max-width:none
  }
  .page-heading .actions {
    justify-content:flex-end
  }
  .modal-backdrop {
    padding:12px
  }
  .modal {
    max-height:calc(100vh - 24px)
  }
  .modal-body {
    padding:19px
  }
  .login-card {
    padding:27px
  }
  .activity-layout {
    gap:18px
  }
  .topbar .breadcrumb span {
    display:none
  }
}
.badge svg,
.card-footer svg {
  width:12px;
  height:12px;
}
.message-label svg {
  width:11px;
  height:11px;
}
.error-banner span {
  display:flex;
  align-items:center;
  gap:8px;
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation:none !important;
    transition:none !important;
    scroll-behavior:auto !important;
  }
}
.profile {
  min-width:0;
}
.profile > div {
  min-width:0;
  flex:1;
}
.profile strong,
.profile small {
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.profile .icon-button {
  flex-shrink:0;
}
.template-composer {
  border-top:1px solid var(--line);
  margin:6px 0 12px;
  padding-top:10px;
}
.template-composer summary {
  cursor:pointer;
  font-size:10px;
  font-weight:600;
  color:var(--teal);
  padding:3px 0;
}
.template-composer > .helper {
  margin:10px 0 14px;
}
.template-composer .field {
  margin-bottom:12px;
}
.template-composer .field textarea {
  min-height:76px;
  border:1px solid #dfe5d8;
  padding:10px 11px;
  background:#fff;
}
.template-composer .field label {
  font-size:10px;
}
.composer-area:has(.template-composer[open]) {
  max-height:70%;
  overflow-y:auto;
}
.workspace-extension {margin-top:24px}.operator-login {margin:22px 0}.operator-login summary {cursor:pointer;color:var(--muted)}.operator-login form {margin-top:18px}.account-switch {margin-top:12px}.member-row,.connector-row {display:flex;gap:15px;align-items:center;padding:16px 0;border-bottom:1px solid var(--border);flex-wrap:wrap}.member-row>div,.connector-row>div:first-child {flex:1;min-width:160px}.member-row small {display:block;margin-top:4px;color:var(--muted)}.inline-form {display:flex;align-items:end;gap:12px;margin-top:20px;flex-wrap:wrap}.inline-form .field {flex:1;min-width:200px;margin:0}.code-input,.connector-result {font-family:ui-monospace,monospace;font-size:12px}.connector-result {white-space:pre-wrap;overflow-wrap:anywhere;background:#f4f6fa;padding:15px;border-radius:10px;max-height:350px;overflow:auto}.check-label {display:flex;gap:9px;align-items:start;margin:15px 0;font-size:13px}.check-label input {width:auto;margin-top:3px}

.merchant-agent-layout {display:grid;grid-template-columns:minmax(0,2fr) minmax(230px,1fr);gap:24px;align-items:start}
.agent-turns {padding:0 24px;max-height:65vh;overflow:auto}
.agent-turn {padding:24px 0;border-bottom:1px solid var(--line)}
.agent-turn:last-child {border-bottom:0}
.agent-turn-heading {display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:12px}
.agent-turn-heading>span:not(.badge) {color:var(--muted)}
.agent-text {white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.65}
.agent-answer {padding:15px;background:var(--teal-light);border-radius:10px;margin:18px 0}
.agent-answer strong {font-size:12px;color:var(--teal)}
.agent-proposal {border:1px solid var(--line);border-radius:10px;padding:16px;margin:14px 0}
.agent-proposal h3 {margin:0 0 12px}
.agent-proposal dl {margin:0}
.agent-proposal dl>div {display:grid;grid-template-columns:110px minmax(0,1fr);gap:12px;margin:9px 0;font-size:12px}
.agent-proposal dt {color:var(--muted)}
.agent-proposal dd {margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.record-value {max-width:320px;white-space:pre-wrap;overflow-wrap:anywhere}
.merchant-agent-layout aside .card-body p {line-height:1.6}
.merchant-agent-layout aside .button {margin-top:10px}
@media(max-width:1000px){.merchant-agent-layout{grid-template-columns:1fr}.agent-turns{max-height:none}.merchant-agent-layout aside{grid-row:1}.merchant-agent-layout aside .card:last-child{display:none}}
@media(max-width:560px){.agent-proposal dl>div{grid-template-columns:1fr;gap:4px}.agent-turns{padding:0 16px}}

/* The product shares the website's type and ink, with compact controls for daily work. */
:root { --blue:#2563eb; --border:var(--line); --shadow:0 3px 14px #11131803; color-scheme:light; }
body { -webkit-font-smoothing:antialiased; }
button:disabled { cursor:not-allowed; }
h1 { font-family:'Instrument Serif',Georgia,serif; font-size:48px; font-weight:400; letter-spacing:-1px; line-height:1.08; }
h2,h3,h4,.brand { font-family:Geist,system-ui,sans-serif; font-weight:600; }
a,button,input,select,textarea,summary { scroll-margin-top:24px; }
summary { cursor:pointer; }
summary:focus-visible { outline:2px solid var(--blue); outline-offset:4px; }
.shell { grid-template-columns:232px minmax(0,1fr); }
.sidebar { width:232px; padding:18px 16px 14px; background:#fff; overflow-y:auto; }
.brand { padding:0 12px; color:var(--ink); }
.wordmark { width:140px; height:52px; display:block; object-fit:contain; }
.workspace-picker { margin:16px 0 20px; padding:11px 9px; border-radius:9px; box-shadow:none; }
.workspace-picker>div { min-width:0; flex:1; }
.workspace-picker select { width:100%; max-width:156px; font-size:12px; font-weight:550; }
.workspace-icon { color:#586477; background:#f2f4f7; border-color:var(--line); }
.nav { gap:18px; flex:1; }
.nav-group { display:flex; flex-direction:column; gap:3px; }
.nav-label { margin:0 0 6px; padding:0 12px; font-size:10px; letter-spacing:1.1px; color:var(--muted); font-weight:500; }
.nav a { min-height:36px; padding:8px 12px; color:#535d6d; font-size:13px; gap:11px; border-radius:7px; }
.nav a svg { width:17px; height:17px; }
.nav a.active { background:#eef4ff; color:#1d4ed8; font-weight:600; }
.sidebar-bottom { margin-top:20px; flex-shrink:0; }
.agent-health { margin:0 0 14px; padding:10px 12px; background:#f8f9fb; border:0; }
.health-caption { font-size:11px; }
.profile { padding:13px 2px 0; }
.topbar { height:64px; background:#fff; padding:0 36px; }
.topbar .badge { font-size:11px; }
.breadcrumb { font-size:13px; }
.breadcrumb strong { color:var(--ink); }
.page { padding:32px 36px 48px; }
.page-heading { margin-bottom:28px; gap:20px; }
.eyebrow { color:#667084; font-family:'Geist Mono',monospace; font-size:10px; font-weight:400; letter-spacing:1.1px; }
.subtitle { font-size:14px; line-height:1.6; color:var(--muted); margin-top:10px; max-width:660px; }
.button { min-height:40px; font-size:13px; padding:9px 14px; font-weight:500; border-radius:7px; box-shadow:0 1px 2px #11131806; }
.button.primary { background:var(--blue); border-color:var(--blue); color:#fff; }
.button.primary:hover { background:#1d4ed8; border-color:#1d4ed8; }
.button.small { min-height:34px; font-size:12px; padding:7px 10px; }
.button.ghost { box-shadow:none; }
.icon-button { min-height:34px; min-width:34px; }
.button:focus-visible,.icon-button:focus-visible,a:focus-visible { outline:2px solid var(--blue); outline-offset:3px; }
.badge { font-size:11px; padding:4px 8px; font-weight:500; }
.badge.gray { color:#596273; background:#f4f5f7; }
.card { border-radius:12px; box-shadow:var(--shadow); }
.card-header { padding:20px 22px; gap:14px; flex-wrap:wrap; }
.card-header h2 { font-size:15px; }
.card-header p { font-size:12px; color:var(--muted); line-height:1.6; margin-top:5px; }
.card-body { padding:22px; }
.card-body>p+p { margin-top:10px; }
.helper,.field small { font-size:12px; line-height:1.6; }
.field label { font-size:13px; font-weight:500; }
.field input,.field select,.field textarea { font-size:14px; padding:11px 12px; border-color:#dce1e8; background:#fff; border-radius:7px; }
.field textarea { line-height:1.6; }
.text-link { font-size:12px; }
.notice,.notice.teal { font-size:13px; line-height:1.7; border-radius:9px; }
.notice.teal { background:#eef4ff; color:#25406e; border-color:#dbe7fd; }
.reviewer-banner { display:flex; align-items:center; justify-content:space-between; gap:18px; background:#eef4ff; border:1px solid #dbe7fd; padding:16px 20px; border-radius:10px; margin-bottom:24px; }
.reviewer-banner strong { font-size:13px; font-weight:600; }
.reviewer-banner p { font-size:12px; color:#4b6083; margin-top:4px; }
.reviewer-banner .button { flex-shrink:0; }
.metrics { gap:16px; margin-bottom:24px; }
.metric { border-radius:10px; padding:20px; box-shadow:none; }
.metric-top { font-size:12px; color:#606978; }
.metric-value { font-size:34px; font-weight:500; letter-spacing:-1px; }
.metric-caption { font-size:11px; line-height:1.6; }
.metric-icon { background:#f2f5fa; color:#68768c; }
.dashboard-grid { grid-template-columns:minmax(0,1.5fr) minmax(280px,1fr); gap:22px; }
.stack { gap:22px; }
td,th { border-color:#edf0f4; }
th { background:#fafbfd; color:#667084; font-size:10px; font-weight:500; letter-spacing:.8px; }
td { font-size:13px; padding-top:18px; padding-bottom:18px; }
.table-wrap { overflow:auto; }
.table-wrap table { min-width:540px; }
.person strong { font-size:12px; font-weight:600; }
.person small,.cell-sub,.due { font-size:11px; line-height:1.6; }
.cell-title { font-size:12px; line-height:1.6; font-weight:500; }
.card-footer { background:#fafbfd; color:var(--muted); font-size:11px; }
.assistant-card { background:#eef4ff; border-color:#dbe7fd; }
.assistant-card p { font-size:13px; }
.timeline-copy p { font-size:12px; }
.timeline-copy small { font-size:11px; }
.empty { padding:44px 22px; }
.empty strong { font-size:15px; }
.empty p { font-size:13px; max-width:380px; line-height:1.7; }
.toolbar { flex-wrap:wrap; gap:12px; font-size:13px; }
.toolbar select { max-width:100%; font-size:13px; }
.merchant-agent-layout { grid-template-columns:minmax(0,1fr) 280px; gap:24px; }
.merchant-agent-layout>.stack,.merchant-agent-layout aside { min-width:0; }
.agent-composer { border-color:#cfddf8; }
.agent-composer textarea { min-height:110px; }
.agent-composer .field { margin-bottom:12px; }
.agent-composer .form-actions { margin-bottom:12px; }
.agent-turns { max-height:none; overflow:visible; padding:0 22px; }
.agent-turn { padding:20px 0; }
.turn-summary { display:flex; flex-direction:column; gap:12px; list-style:none; padding-right:24px; position:relative; }
.turn-summary::-webkit-details-marker { display:none; }
.turn-summary::after { content:'+'; position:absolute; right:0; top:0; color:var(--muted); font-size:20px; }
.agent-turn[open]>.turn-summary::after { content:'−'; }
.turn-request { font-size:14px; line-height:1.65; font-weight:500; overflow-wrap:anywhere; }
.agent-turn:not([open]) .turn-request { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.turn-meta { display:flex; gap:12px; align-items:center; font-size:11px; color:var(--muted); }
.turn-body { margin-top:18px; }
.agent-answer { padding:16px; background:#f7f9fc; margin:16px 0; }
.agent-answer strong { color:#42526e; font-size:12px; }
.agent-text { font-size:13px; margin-top:8px; }
.decision-bar { display:flex; flex-wrap:wrap; gap:14px; border:1px solid #dbe7fd; background:#eef4ff; border-radius:9px; padding:16px; }
.decision-bar strong { font-size:13px; }
.decision-bar p,.decision-note { font-size:12px; color:#4b6083; line-height:1.65; }
.decision-note { border-left:2px solid var(--blue); padding-left:12px; }
.agent-proposal { margin:12px 0; padding:16px; border-radius:9px; }
.proposal-title { display:flex; gap:9px; align-items:center; color:var(--ink); margin-bottom:12px; }
.proposal-title svg { color:var(--blue); width:16px; height:16px; }
.proposal-title h3 { margin:0; font-size:13px; }
.agent-proposal dl>div { grid-template-columns:90px minmax(0,1fr); font-size:12px; }
.proposal-fields { list-style:none; margin:14px 0; padding:0; border-top:1px solid var(--line); }
.proposal-fields li { display:flex; flex-wrap:wrap; justify-content:space-between; gap:6px; padding:9px 0; border-bottom:1px solid #edf0f4; font-size:12px; }
.proposal-fields strong { font-weight:500; }
.proposal-fields span { color:var(--muted); }
.proposal-technical { margin-top:12px; }
.proposal-technical summary { color:var(--blue); font-size:12px; padding:6px 0; }
.connector-result,.code-input,.code-value { font-family:'Geist Mono',monospace; font-size:11px; overflow-wrap:anywhere; }
.build-options { padding:4px 20px; }
.build-options>a { display:flex; align-items:center; gap:12px; padding:18px 0; color:var(--ink); border-bottom:1px solid var(--line); }
.build-options>a:last-child { border:0; }
.build-options>a>svg { color:#6a7c96; width:17px; height:17px; }
.build-options>a>svg:last-child { margin-left:auto; width:14px; }
.build-options strong,.build-options small { display:block; }
.build-options strong { font-size:13px; font-weight:500; }
.build-options small { font-size:11px; line-height:1.6; color:var(--muted); margin-top:3px; }
.agent-guide { padding:12px 4px; }
.agent-guide h2 { font-family:'Instrument Serif',Georgia,serif; font-size:31px; line-height:1.1; font-weight:400; margin:12px 0; }
.agent-guide p { font-size:12px; color:var(--muted); line-height:1.75; margin-bottom:14px; }
.record-value { min-width:130px; max-width:320px; }
.record-customer { background:none; border:0; padding:0; display:inline-flex; gap:8px; align-items:center; color:var(--blue); text-align:left; line-height:1.6; }
.record-customer svg { width:13px; height:13px; }
.promise-comparison { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin:20px 0; }
.promise-comparison>div { background:#f8f9fb; border-radius:8px; padding:16px; min-width:0; }
.promise-values dt { font-size:11px; color:var(--muted); margin-top:12px; }
.promise-values dd { margin:4px 0 0; font-size:13px; overflow-wrap:anywhere; }
.inbox-shell { border-radius:12px; grid-template-columns:230px minmax(280px,1fr) 270px; }
.inbox-list,.customer-panel { background:#fff; }
.customer-row { padding:16px; }
.customer-row.selected { background:#eef4ff; border-color:var(--blue); }
.customer-row-copy strong { font-size:13px; }
.customer-row-copy p { font-size:11px; }
.customer-row-copy small { font-size:10px; }
.conversation { background:#fff; }
.conversation-head { padding:16px 20px; }
.messages { background:#fafbfd; }
.bubble { font-size:13px; line-height:1.7; border-radius:12px; }
.outbound .bubble { background:#edf3ff; border-color:#dbe7fd; color:#192d50; }
.message-label,.message-meta { font-size:10px; }
.mode-note,.composer-footer { font-size:11px; line-height:1.6; }
.customer-panel { padding:20px; }
.detail-row { font-size:12px; gap:12px; }
.detail-row strong { overflow-wrap:anywhere; text-align:right; }
.consent-label { font-size:12px; line-height:1.6; }
.playbook-card>p { font-size:13px; line-height:1.8; }
.approval-copy { font-size:14px; line-height:1.8; }
.modal { border-radius:14px; }
.modal-header h2 { font-size:18px; }
.modal-body>p { font-size:13px; margin-bottom:16px; }
.login-screen { background:#f8f9fb; min-height:100dvh; }
.account-screen { display:grid; grid-template-columns:1fr 1fr; padding:48px; gap:8vw; align-items:center; }
.login-story { max-width:510px; margin-left:auto; padding:30px; }
.login-story h2 { font:400 clamp(48px,5vw,76px)/1.02 'Instrument Serif',Georgia,serif; letter-spacing:-1.5px; margin:24px 0; }
.login-story p { color:#606978; font-size:16px; line-height:1.8; max-width:360px; }
.story-note { font:11px 'Geist Mono',monospace; color:#667084; margin-top:80px; }
.login-card { width:100%; max-width:420px; padding:36px; box-shadow:0 8px 40px #11131805; border-radius:14px; }
.login-card .brand { margin-bottom:28px; }
.login-card h1 { font-size:42px; }
.login-card p { font-size:13px; line-height:1.7; }
.login-card .helper { font-size:11px; }
.operator-login { border-top:1px solid var(--line); padding-top:18px; font-size:12px; }
.skip-link { position:fixed; left:12px; top:-80px; z-index:100; padding:12px 18px; color:#fff; background:var(--blue); border-radius:6px; }
.skip-link:focus { top:12px; }
.nav-scrim { display:none; }
@media (max-width:1400px) {
 .inbox-shell { grid-template-columns:210px minmax(270px,1fr); height:auto; }
 .customer-panel { grid-column:1/-1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; border-left:0; border-top:1px solid var(--line); overflow:visible; }
 .customer-panel .panel-section { padding:0; margin:0; border:0; }
 .inbox-list,.conversation { height:650px; }
}
@media (max-width:1100px) {
 .shell { grid-template-columns:212px minmax(0,1fr); }
 .sidebar { width:212px; }
 .page { padding:28px 24px 40px; }
 .topbar { padding:0 24px; }
 .dashboard-grid,.settings-grid,.activity-layout { grid-template-columns:1fr; }
 .dashboard-grid>.stack { display:flex; }
 .merchant-agent-layout { grid-template-columns:minmax(0,1fr); }
 .merchant-agent-layout aside { grid-row:auto; display:grid; grid-template-columns:1fr 1fr; }
 .merchant-agent-layout aside .card:last-child { display:block; }
 .metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .page-heading h1 { font-size:44px; }
}
@media (max-width:740px) {
 .shell { display:block; }
 .sidebar { width:250px; z-index:40; padding:16px; box-shadow:none; height:100dvh; }
 .sidebar.open { box-shadow:15px 0 50px #11131812; }
 .sidebar:not(.open) { visibility:hidden; }
 .sidebar.open .workspace-picker select { width:100%; }
 .nav-scrim { display:block; position:fixed; inset:0; background:#11131840; border:0; z-index:30; }
 .topbar { height:60px; padding:0 16px; }
 .mobile-menu { display:inline-flex; }
 .page,.route-inbox .page { padding:26px 16px 36px; }
 .page-heading { flex-direction:column; align-items:stretch; gap:16px; }
 .page-heading h1 { font-size:40px; }
 .page-heading .subtitle { font-size:13px; max-width:none; }
 .page-heading .actions { justify-content:flex-start; }
 .page-heading>.actions .button { font-size:12px; padding:9px 12px; }
 .eyebrow { font-size:10px; }
 .reviewer-banner { flex-direction:column; align-items:flex-start; padding:16px; }
 .metrics { gap:12px; }
 .metric { padding:16px; }
 .metric-top { font-size:11px; }
 .metric-value { font-size:30px; }
 .metric-caption { font-size:11px; }
 .metric-icon { display:none; }
 .dashboard-grid th:last-child,.dashboard-grid td:last-child { display:table-cell; }
 .dashboard-grid .person strong { font-size:12px; }
 .table-wrap table { min-width:540px; }
 .card-header,.dashboard-grid .card-header,.card-body { padding:18px; }
 .card-header h2 { font-size:15px; }
 .merchant-agent-layout aside { display:flex; }
 .merchant-agent-layout aside .card { display:none; }
 .agent-guide { padding:8px 2px; }
 .agent-turns { padding:0 18px; }
 .turn-request { font-size:13px; }
 .form-actions { flex-wrap:wrap; gap:14px; }
 .agent-proposal dl>div { grid-template-columns:1fr; gap:4px; }
 .promise-comparison { grid-template-columns:1fr; }
 .inbox-shell { grid-template-columns:minmax(0,1fr); }
 .inbox-list { height:auto; }
 .customer-list { max-height:150px; }
 .conversation { height:650px; min-height:500px; }
 .conversation-head { padding:14px; }
 .conversation-head .button { font-size:11px; }
 .customer-panel { display:block; padding:20px; }
 .customer-panel .panel-section { padding:0 0 20px; margin:0 0 20px; border-bottom:1px solid var(--line); }
 .account-screen { display:flex; padding:28px 16px; }
 .login-story { display:none; }
 .login-card { max-width:420px; padding:28px 24px; }
 .login-card h1 { font-size:40px; }
 .button,.button.small { min-height:40px; }
 .icon-button { min-height:40px; min-width:40px; }
 .error-banner { flex-wrap:wrap; gap:12px; }
}
.portal-page { background:#f8f9fb; }
.portal-shell { width:min(760px,100%); margin:0 auto; padding:0 24px 20px; }
.portal-header { display:flex; justify-content:space-between; align-items:center; padding:20px 4px; }
.portal-header .wordmark { width:120px; height:45px; }
.portal-private { font:10px 'Geist Mono',monospace; color:var(--muted); }
.portal-conversation { border:1px solid var(--line); background:#fff; border-radius:14px; overflow:hidden; }
.portal-heading { padding:28px 28px 22px; border-bottom:1px solid var(--line); }
.portal-heading h1 { font-size:38px; margin:8px 0; }
.portal-heading p { font-size:13px; color:var(--muted); }
#status[data-state="error"] { color:var(--red); background:var(--red-light); padding:12px; border-radius:7px; }
.portal-messages { max-height:48dvh; min-height:160px; overflow:auto; padding:24px 28px; background:#fafbfd; }
.portal-message { max-width:85%; margin:0 0 20px; }
.portal-message.from-customer { margin-left:auto; }
.portal-message>strong { display:block; font-size:11px; color:var(--muted); font-weight:500; margin-bottom:6px; }
.portal-message>p { white-space:pre-wrap; overflow-wrap:anywhere; background:#fff; border:1px solid var(--line); border-radius:11px; padding:13px 16px; font-size:14px; line-height:1.75; }
.portal-message.from-customer>p { background:#edf3ff; border-color:#dbe7fd; color:#192d50; }
.portal-message>time { display:block; font-size:10px; color:var(--muted); margin-top:6px; }
.portal-empty { color:var(--muted); font-size:13px; padding:20px 0; text-align:center; }
.portal-composer { padding:24px 28px; border-top:1px solid var(--line); }
.portal-composer .field { margin-bottom:12px; }
.portal-composer .check-label { font-size:12px; line-height:1.6; }
.portal-send { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.portal-privacy { margin-top:20px; color:var(--muted); font-size:11px; }
.portal-privacy p { margin-top:10px; line-height:1.8; }
.portal-footer { text-align:center; font-size:11px; color:var(--muted); padding:20px; }
@media(max-width:740px) {
 .portal-shell { padding:0 12px 12px; }
 .portal-private { font-size:9px; }
 .portal-header { padding:12px 4px; }
 .portal-heading,.portal-composer { padding:20px; }
 .portal-heading h1 { font-size:34px; }
 .portal-messages { padding:20px; max-height:45dvh; }
 .portal-message { max-width:93%; }
 .portal-send { align-items:flex-start; }
 .portal-send .helper { max-width:120px; font-size:11px; }
}
.sidebar { overflow:hidden; }
.nav { min-height:0; overflow-y:auto; flex-shrink:1; scrollbar-width:thin; }
.nav-group { flex-shrink:0; }
.sidebar-bottom { margin-top:14px; }
.loading-state { border:1px solid var(--line); background:#fff; padding:30px; border-radius:12px; color:var(--muted); font-size:13px; }
.loading-line { display:block; width:40%; height:8px; border-radius:10px; background:#e5edfd; margin-bottom:16px; }
.field label,.metric-caption,.metric-caption.good { color:#606978; }
.field label { color:#303b4b; }
.table-hint { display:none; padding:10px 18px 0; font-size:11px; color:var(--muted); }
@media(max-width:740px) { .table-hint { display:block; } }
.table-wrap:focus-visible { outline:2px solid var(--blue); outline-offset:-3px; }
.mode-note,.composer-footer,.detail-row strong,.due { color:#606978; }
.composer { border-color:#dce1e8; }
.business-app-shell { max-width:1440px; margin:auto; padding:28px; }
.business-app-header { padding:24px; background:#fff; border:1px solid var(--line); border-radius:12px; }
.business-app-header h1 { font-size:40px; margin:20px 0 12px; }
.business-app-header p { font-size:13px; line-height:1.8; color:var(--muted); margin-bottom:12px; overflow-wrap:anywhere; }
@media(max-width:740px) { .business-app-shell { padding:16px; } .business-app-header { padding:18px; } }
.stack { min-width:0; }
@media(max-width:1100px) { .dashboard-grid,.settings-grid,.activity-layout { grid-template-columns:minmax(0,1fr); } }
.dashboard-grid>.stack { align-items:stretch; }
.proposal-reference { display:block; font:10px/1.7 'Geist Mono',monospace; color:var(--muted); margin-top:3px; }

.integration-catalog {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px;margin-top:20px}
.integration-card {border:1px solid var(--border);border-radius:10px;padding:18px;min-width:0;display:flex;flex-direction:column;gap:14px}
.integration-card-heading {display:flex;align-items:start;justify-content:space-between;gap:10px;flex-wrap:wrap}
.integration-card h3 {margin-top:5px;font-size:16px}
.integration-card>p {font-size:13px;line-height:1.6;color:var(--muted)}
.integration-card>details {font-size:13px}
.integration-card summary {cursor:pointer;color:var(--text);line-height:1.5}
.integration-card>.actions {margin-top:auto;flex-wrap:wrap}
.integration-setup {padding-left:20px;margin:14px 0;font-size:13px;line-height:1.6}
.integration-setup li+li {margin-top:8px}
.connection-status {display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.connector-address {overflow-wrap:anywhere}