#crm-view {
  --crm-green: #3ecf8e;
  --crm-green-soft: #14271f;
  --crm-amber: #e0aa52;
  --crm-red: #ff8d85;
  --crm-blue: #7fb7ff;
  --crm-panel: #171818;
  --crm-panel-raised: #1c1e1d;
  --crm-panel-deep: #111212;
  --crm-line: #303432;
  --crm-copy: #eef2f0;
  --crm-muted: #98a19c;
}

#crm-view .panel-heading {
  margin-bottom: 0.85rem;
}

#crm-view .panel-heading > div {
  max-width: 52rem;
}

#crm-view .panel-heading p:last-child {
  max-width: 48rem;
}

.crm-private-status {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin: 0;
  color: var(--crm-muted);
  font-size: 0.65rem;
}

.crm-private-status::before {
  width: 0.42rem;
  height: 0.42rem;
  border-radius: 50%;
  background: var(--crm-green);
  content: "";
}

.crm-prototype-banner {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.75rem;
  align-items: start;
  margin: 0 0 0.85rem;
  padding: 0.72rem 0.82rem;
  border: 1px solid #665022;
  border-radius: 0.38rem;
  color: #d9c99e;
  background: #1c1912;
  font-size: 0.72rem;
  line-height: 1.45;
}

.crm-prototype-banner[hidden] {
  display: none;
}

.crm-prototype-banner strong {
  padding: 0.14rem 0.38rem;
  border-radius: 999px;
  color: #171308;
  background: var(--crm-amber);
  font-size: 0.56rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

#crm-view .module-content {
  min-width: 0;
  padding: 0;
}

#crm-view [data-module-panel="crm"] {
  min-width: 0;
  min-height: calc(100vh - 12.75rem);
}

.crm-page {
  min-height: inherit;
  padding: clamp(0.85rem, 1.7vw, 1.35rem);
}

.crm-page-header,
.crm-toolbar,
.crm-source-bar,
.crm-section-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.crm-page-header {
  margin-bottom: 1rem;
}

.crm-page-header h3,
.crm-section-heading h3,
.crm-source-bar h3,
.crm-detail-pane h3,
.crm-lead-workspace h3 {
  margin: 0;
  color: var(--crm-copy);
  letter-spacing: -0.02em;
}

.crm-page-header h3 {
  font-size: clamp(1.12rem, 2vw, 1.45rem);
}

.crm-page-header p,
.crm-section-heading p,
.crm-source-bar p {
  margin: 0.28rem 0 0;
  color: var(--crm-muted);
  font-size: 0.74rem;
  line-height: 1.5;
}

.crm-health-pill,
.crm-filter-chip,
.crm-queue-meta span,
.crm-simple-card > span,
.crm-task-row > span,
.crm-attention-row > span {
  display: inline-flex;
  width: max-content;
  align-items: center;
  border: 1px solid #3b403d;
  border-radius: 999px;
  padding: 0.18rem 0.46rem;
  color: #bac2be;
  background: #151716;
  font-size: 0.58rem;
  font-weight: 780;
  line-height: 1.25;
}

.crm-health-pill[data-state="ready"] {
  border-color: #2c805a;
  color: #73e3af;
  background: #10261c;
}

.crm-health-pill[data-state="warning"] {
  border-color: #79602b;
  color: #f0c66f;
  background: #241e12;
}

.crm-health-pill[data-state="error"] {
  border-color: #8f514b;
  color: #ffc0bb;
  background: #251716;
}

.crm-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.55rem;
  margin-bottom: 0.85rem;
}

.crm-kpi-card {
  min-width: 0;
  border: 1px solid var(--crm-line);
  border-radius: 0.38rem;
  padding: 0.78rem;
  background: var(--crm-panel);
}

.crm-kpi-card span,
.crm-kpi-card small {
  display: block;
  color: var(--crm-muted);
  font-size: 0.62rem;
}

.crm-kpi-card strong {
  display: block;
  overflow: hidden;
  margin: 0.25rem 0 0.16rem;
  color: var(--crm-copy);
  font-size: clamp(1.25rem, 2.6vw, 1.75rem);
  line-height: 1;
  text-overflow: ellipsis;
}

.crm-overview-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(15rem, 0.8fr);
  gap: 0.7rem;
}

.crm-overview-card,
.crm-source-bar,
.crm-detail-pane,
.crm-action-pane,
.crm-lead-workspace,
.crm-simple-card,
.crm-more-card {
  border: 1px solid var(--crm-line);
  border-radius: 0.4rem;
  background: var(--crm-panel);
}

.crm-overview-card {
  min-width: 0;
  padding: 0.9rem;
}

.crm-attention-list {
  display: grid;
  margin-top: 0.65rem;
  border-top: 1px solid var(--crm-line);
}

.crm-attention-row {
  display: grid;
  width: 100%;
  grid-template-columns: 4.5rem minmax(0, 1fr) auto;
  gap: 0.7rem;
  align-items: center;
  border: 0;
  border-bottom: 1px solid var(--crm-line);
  padding: 0.68rem 0.1rem;
  color: var(--crm-copy);
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.crm-attention-row:hover {
  background: #1a1c1b;
}

.crm-attention-row > span:nth-child(2) {
  display: grid;
  gap: 0.14rem;
  min-width: 0;
}

.crm-attention-row strong,
.crm-attention-row small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.crm-attention-row strong {
  font-size: 0.75rem;
}

.crm-attention-row small {
  color: var(--crm-muted);
  font-size: 0.64rem;
}

.crm-attention-row i {
  color: var(--crm-green);
  font-style: normal;
}

.crm-source-breakdown {
  display: grid;
  gap: 0.7rem;
  margin: 0.8rem 0 0;
}

.crm-source-breakdown div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.3rem 0.6rem;
  align-items: center;
}

.crm-source-breakdown dt,
.crm-source-breakdown dd {
  margin: 0;
  font-size: 0.68rem;
}

.crm-source-breakdown dt {
  color: var(--crm-muted);
}

.crm-source-breakdown dd {
  color: var(--crm-copy);
  font-weight: 760;
}

.crm-source-breakdown i {
  grid-column: 1 / -1;
  height: 0.24rem;
  overflow: hidden;
  border-radius: 999px;
  background: #292c2a;
}

.crm-source-breakdown i::before {
  display: block;
  width: var(--crm-bar, 50%);
  height: 100%;
  border-radius: inherit;
  background: var(--crm-green);
  content: "";
}

.crm-source-bar {
  align-items: center;
  margin-bottom: 0.65rem;
  padding: 0.78rem 0.85rem;
}

.crm-source-bar > div:first-child {
  min-width: 0;
}

.crm-source-bar h3 {
  overflow-wrap: anywhere;
  font-size: 0.85rem;
}

.crm-source-actions {
  display: flex;
  flex: 0 0 auto;
  gap: 0.4rem;
}

.crm-coverage-note {
  margin: 0.55rem 0 0;
  color: var(--crm-muted);
  font-size: 0.64rem;
  line-height: 1.45;
}

.crm-error-state {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.65rem;
  border: 1px solid #714642;
  border-radius: 0.38rem;
  padding: 0.72rem 0.8rem;
  color: #ffc0bb;
  background: #251716;
}

.crm-error-state[hidden] {
  display: none;
}

.crm-error-state strong,
.crm-error-state p {
  display: block;
  margin: 0;
}

.crm-error-state p {
  margin-top: 0.15rem;
  color: #dba9a5;
  font-size: 0.68rem;
}

.crm-workbench {
  display: grid;
  min-height: 34rem;
  grid-template-columns: minmax(13rem, 0.78fr) minmax(20rem, 1.45fr) minmax(13.5rem, 0.82fr);
  overflow: hidden;
  border: 1px solid var(--crm-line);
  border-radius: 0.4rem;
  background: var(--crm-panel-deep);
}

.crm-queue-pane,
.crm-detail-pane,
.crm-action-pane {
  min-width: 0;
}

.crm-queue-pane {
  border-right: 1px solid var(--crm-line);
  background: #121313;
}

.crm-pane-header {
  display: flex;
  min-height: 3.25rem;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  border-bottom: 1px solid var(--crm-line);
  padding: 0.65rem 0.72rem;
}

.crm-pane-header h3 {
  margin: 0;
  font-size: 0.78rem;
}

.crm-filter-row {
  display: flex;
  gap: 0.3rem;
}

.crm-filter-chip {
  appearance: none;
  border-radius: 0.3rem;
  font: inherit;
  cursor: pointer;
}

.crm-filter-chip.is-active {
  border-color: #367456;
  color: #9be8c1;
  background: var(--crm-green-soft);
}

.crm-intake-list {
  display: grid;
  max-height: 46rem;
  overflow-y: auto;
}

.crm-queue-item {
  display: grid;
  width: 100%;
  gap: 0.33rem;
  border: 0;
  border-bottom: 1px solid var(--crm-line);
  padding: 0.7rem;
  color: var(--crm-copy);
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.crm-queue-item:hover,
.crm-queue-item[aria-pressed="true"] {
  background: #1a1c1b;
}

.crm-queue-item[aria-pressed="true"] {
  box-shadow: inset 2px 0 0 var(--crm-green);
}

.crm-queue-item.is-quarantined {
  background: #1c1716;
  box-shadow: inset 2px 0 0 #b96960;
}

.crm-queue-item.is-quarantined .crm-queue-meta span:last-child {
  border-color: #8f514b;
  color: #ffc0bb;
  background: #251716;
}

.crm-queue-item-top,
.crm-queue-meta {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 0.45rem;
}

.crm-queue-item-top strong {
  overflow: hidden;
  font-size: 0.72rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.crm-queue-item-top time {
  flex: 0 0 auto;
  color: #7f8883;
  font-size: 0.56rem;
}

.crm-queue-subject,
.crm-queue-preview {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
}

.crm-queue-subject {
  -webkit-line-clamp: 1;
  color: #d5dad7;
  font-size: 0.68rem;
  font-weight: 680;
}

.crm-queue-preview {
  -webkit-line-clamp: 2;
  color: var(--crm-muted);
  font-size: 0.62rem;
  line-height: 1.45;
}

.crm-queue-meta {
  justify-content: flex-start;
}

.crm-queue-meta span {
  padding: 0.12rem 0.35rem;
  font-size: 0.52rem;
  text-transform: capitalize;
}

.crm-detail-pane {
  border: 0;
  border-right: 1px solid var(--crm-line);
  border-radius: 0;
  background: var(--crm-panel);
}

.crm-detail-heading {
  min-height: 6.5rem;
  border-bottom: 1px solid var(--crm-line);
  padding: 1rem;
}

.crm-detail-heading h3 {
  max-width: 42rem;
  font-size: clamp(1.05rem, 2vw, 1.35rem);
  line-height: 1.2;
}

.crm-detail-heading > p {
  margin: 0.3rem 0 0;
  color: var(--crm-muted);
  font-size: 0.7rem;
}

.crm-detail-body {
  min-height: 9rem;
  padding: 1rem;
  color: #d8ddda;
  font-size: 0.78rem;
  line-height: 1.7;
  white-space: pre-wrap;
}

.crm-detail-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0 1rem 1rem;
  border: 1px solid var(--crm-line);
  border-radius: 0.35rem;
}

.crm-detail-facts div {
  min-width: 0;
  padding: 0.6rem;
  border-bottom: 1px solid var(--crm-line);
}

.crm-detail-facts div:nth-child(odd) {
  border-right: 1px solid var(--crm-line);
}

.crm-detail-facts div:nth-last-child(-n + 2) {
  border-bottom: 0;
}

.crm-detail-facts dt,
.crm-detail-facts dd,
.crm-record-facts dt,
.crm-record-facts dd {
  margin: 0;
}

.crm-detail-facts dt,
.crm-record-facts dt {
  color: #7f8883;
  font-size: 0.55rem;
  font-weight: 780;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.crm-detail-facts dd,
.crm-record-facts dd {
  overflow-wrap: anywhere;
  margin-top: 0.2rem;
  color: #dce1de;
  font-size: 0.67rem;
}

.crm-detail-empty {
  margin: 0.75rem 1rem;
  border: 1px dashed #404542;
  border-radius: 0.38rem;
  padding: 0.75rem;
  color: var(--crm-muted);
  font-size: 0.68rem;
}

.crm-detail-empty[hidden] {
  display: none;
}

.crm-action-pane {
  border: 0;
  border-radius: 0;
  padding: 0.85rem;
  background: #121313;
}

.crm-action-pane h3 {
  margin: 0;
  font-size: 0.85rem;
}

.crm-action-pane > p {
  margin: 0.35rem 0 0.8rem;
  color: var(--crm-muted);
  font-size: 0.66rem;
  line-height: 1.5;
}

.crm-action-pane label {
  display: grid;
  gap: 0.35rem;
  color: #cdd3d0;
  font-size: 0.62rem;
  font-weight: 700;
}

.crm-action-pane textarea {
  width: 100%;
  min-height: 7.5rem;
  resize: vertical;
  font: inherit;
  font-size: 0.68rem;
  line-height: 1.5;
}

.crm-action-buttons {
  display: grid;
  gap: 0.42rem;
  margin-top: 0.65rem;
}

.crm-action-buttons .button {
  width: 100%;
  justify-content: center;
}

.crm-action-status {
  min-height: 2.8rem;
  margin-top: 0.65rem !important;
  padding-top: 0.65rem;
  border-top: 1px solid var(--crm-line);
}

.crm-inline-empty {
  margin: 0;
  padding: 0.8rem;
  color: var(--crm-muted);
  font-size: 0.7rem;
  line-height: 1.5;
}

.crm-surface-state {
  border: 1px dashed #454b48;
  border-radius: 0.38rem;
  background: #141615;
}

.crm-card-grid > .crm-surface-state,
.crm-pipeline-board > .crm-surface-state {
  grid-column: 1 / -1;
}

.crm-record-split {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(15rem, 0.72fr);
  gap: 0.7rem;
}

.crm-table-wrap {
  min-width: 0;
  overflow-x: auto;
  border: 1px solid var(--crm-line);
  border-radius: 0.4rem;
}

.crm-table {
  width: 100%;
  min-width: 42rem;
  border-collapse: collapse;
  background: var(--crm-panel);
}

.crm-table th,
.crm-table td {
  border-bottom: 1px solid var(--crm-line);
  padding: 0.65rem 0.7rem;
  text-align: left;
}

.crm-table th {
  color: #828b86;
  background: #121313;
  font-size: 0.56rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.crm-table td {
  color: #cbd1ce;
  font-size: 0.68rem;
}

.crm-table tbody tr {
  cursor: pointer;
}

.crm-table tbody tr:hover,
.crm-table tbody tr.is-selected {
  background: #1c1f1d;
}

.crm-table tbody tr.is-selected {
  box-shadow: inset 2px 0 0 var(--crm-green);
}

.crm-lead-workspace {
  min-height: 21rem;
  padding: 0.9rem;
}

.crm-record-person {
  margin: 0.25rem 0 0.75rem;
  color: var(--crm-muted);
  font-size: 0.68rem;
}

.crm-lead-workspace > p:not(.eyebrow, .crm-record-person, .crm-coverage-note) {
  color: #d6dbd8;
  font-size: 0.74rem;
  line-height: 1.55;
}

.crm-record-facts {
  display: grid;
  gap: 0;
  margin: 0.8rem 0 0;
  border-top: 1px solid var(--crm-line);
}

.crm-record-facts div {
  padding: 0.58rem 0;
  border-bottom: 1px solid var(--crm-line);
}

.crm-pipeline-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(13rem, 1fr));
  gap: 0.6rem;
  overflow-x: auto;
  padding-bottom: 0.35rem;
}

.crm-pipeline-column {
  min-width: 0;
  border: 1px solid var(--crm-line);
  border-radius: 0.4rem;
  background: #121313;
}

.crm-pipeline-column > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  border-bottom: 1px solid var(--crm-line);
  padding: 0.65rem;
}

.crm-pipeline-column h3 {
  margin: 0;
  font-size: 0.72rem;
}

.crm-pipeline-column header span {
  color: var(--crm-muted);
  font-size: 0.58rem;
}

.crm-pipeline-cards {
  display: grid;
  gap: 0.45rem;
  padding: 0.5rem;
}

.crm-pipeline-cards article {
  display: grid;
  gap: 0.3rem;
  border: 1px solid #363a38;
  border-radius: 0.34rem;
  padding: 0.65rem;
  background: var(--crm-panel-raised);
}

.crm-pipeline-cards strong {
  font-size: 0.7rem;
}

.crm-pipeline-cards small {
  color: var(--crm-muted);
  font-size: 0.58rem;
}

.crm-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.6rem;
}

.crm-simple-card,
.crm-more-card {
  min-width: 0;
  padding: 0.8rem;
}

.crm-simple-card h3,
.crm-more-card h3 {
  margin: 0.55rem 0 0.25rem;
  font-size: 0.82rem;
}

.crm-simple-card p,
.crm-more-card p {
  margin: 0;
  color: var(--crm-muted);
  font-size: 0.68rem;
  line-height: 1.45;
}

.crm-simple-card small {
  display: block;
  margin-top: 0.65rem;
  padding-top: 0.55rem;
  border-top: 1px solid var(--crm-line);
  color: #c6cfca;
  font-size: 0.62rem;
}

.crm-task-list {
  display: grid;
  border: 1px solid var(--crm-line);
  border-radius: 0.4rem;
  background: var(--crm-panel);
}

.crm-task-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.65rem;
  align-items: center;
  padding: 0.72rem;
  border-bottom: 1px solid var(--crm-line);
}

.crm-task-row:last-child {
  border-bottom: 0;
}

.crm-task-marker {
  width: 1.1rem;
  height: 1.1rem;
  border: 1px solid #59605d;
  border-radius: 50%;
  background: transparent;
}

.crm-activity-list > .crm-surface-state {
  display: block;
  min-height: 0;
}

.crm-task-row > div {
  display: grid;
  gap: 0.12rem;
  min-width: 0;
}

.crm-task-row strong {
  font-size: 0.72rem;
}

.crm-task-row small {
  color: var(--crm-muted);
  font-size: 0.61rem;
}

.crm-task-row > span[data-priority="High"] {
  border-color: #795e2c;
  color: #f0c46c;
  background: #241e12;
}

.crm-activity-list {
  display: grid;
  max-width: 50rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.crm-activity-list li {
  display: grid;
  grid-template-columns: 5rem 0.7rem minmax(0, 1fr);
  gap: 0.6rem;
  min-height: 3.2rem;
}

.crm-activity-list time {
  padding-top: 0.08rem;
  color: #818985;
  font-size: 0.6rem;
  text-align: right;
}

.crm-activity-list i {
  position: relative;
  width: 0.5rem;
  height: 0.5rem;
  border: 2px solid #1a2b23;
  border-radius: 50%;
  background: var(--crm-green);
}

.crm-activity-list i::after {
  position: absolute;
  top: 0.48rem;
  left: 50%;
  width: 1px;
  height: 2.4rem;
  background: var(--crm-line);
  content: "";
}

.crm-activity-list li:last-child i::after {
  display: none;
}

.crm-activity-list div {
  display: grid;
  align-content: start;
  gap: 0.15rem;
}

.crm-activity-list strong {
  font-size: 0.72rem;
}

.crm-activity-list small {
  color: var(--crm-muted);
  font-size: 0.62rem;
}

.crm-more-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.6rem;
}

.crm-more-card > span {
  color: var(--crm-amber);
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

@media (max-width: 1180px) {
  .crm-workbench {
    grid-template-columns: minmax(13rem, 0.7fr) minmax(20rem, 1.3fr);
  }

  .crm-action-pane {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(12rem, 0.7fr) minmax(18rem, 1.3fr) minmax(12rem, 0.7fr);
    gap: 0.7rem;
    align-items: start;
    border-top: 1px solid var(--crm-line);
  }

  .crm-action-pane > p {
    margin: 0;
  }

  .crm-action-buttons {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 0;
  }

  .crm-action-status {
    grid-column: 1 / -1;
    min-height: 0;
    margin: 0 !important;
    padding-top: 0.55rem;
  }

  .crm-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 840px) {
  #crm-view [data-module-panel="crm"] {
    min-height: 0;
  }

  .crm-page {
    padding: 0.8rem;
  }

  .crm-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .crm-overview-grid,
  .crm-record-split {
    grid-template-columns: minmax(0, 1fr);
  }

  .crm-lead-workspace {
    min-height: 0;
  }

  .crm-pipeline-board {
    grid-template-columns: repeat(4, 15rem);
    scroll-snap-type: x proximity;
  }

  .crm-pipeline-column {
    scroll-snap-align: start;
  }
}

@media (max-width: 700px) {
  .crm-page-header,
  .crm-source-bar,
  .crm-section-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .crm-source-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .crm-source-actions .button {
    width: 100%;
    justify-content: center;
  }

  .crm-workbench {
    grid-template-columns: minmax(0, 1fr);
  }

  .crm-queue-pane {
    border-right: 0;
    border-bottom: 1px solid var(--crm-line);
  }

  .crm-intake-list {
    display: flex;
    max-height: none;
    overflow-x: auto;
    scroll-snap-type: x proximity;
  }

  .crm-queue-item {
    width: min(18rem, 86vw);
    min-width: min(18rem, 86vw);
    border-right: 1px solid var(--crm-line);
    border-bottom: 0;
    scroll-snap-align: start;
  }

  .crm-queue-item[aria-pressed="true"] {
    box-shadow: inset 0 -2px 0 var(--crm-green);
  }

  .crm-detail-pane {
    border-right: 0;
    border-bottom: 1px solid var(--crm-line);
  }

  .crm-action-pane {
    grid-column: auto;
    grid-template-columns: minmax(0, 1fr);
  }

  .crm-action-buttons {
    grid-template-columns: minmax(0, 1fr);
  }

  .crm-action-status {
    grid-column: auto;
  }

  .crm-table {
    min-width: 36rem;
  }

  .crm-card-grid,
  .crm-more-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 460px) {
  .crm-page {
    padding: 0.65rem;
  }

  .crm-private-status {
    align-items: flex-start;
  }

  .crm-kpi-card {
    padding: 0.65rem;
  }

  .crm-kpi-card strong {
    font-size: 1.22rem;
  }

  .crm-attention-row {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .crm-attention-row > span:first-child {
    display: none;
  }

  .crm-source-actions {
    grid-template-columns: minmax(0, 1fr);
  }

  .crm-detail-facts {
    grid-template-columns: minmax(0, 1fr);
  }

  .crm-detail-facts div,
  .crm-detail-facts div:nth-child(odd),
  .crm-detail-facts div:nth-last-child(-n + 2) {
    border-right: 0;
    border-bottom: 1px solid var(--crm-line);
  }

  .crm-detail-facts div:last-child {
    border-bottom: 0;
  }

  .crm-task-row {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .crm-task-row > span {
    grid-column: 2;
  }

  .crm-activity-list li {
    grid-template-columns: 0.65rem minmax(0, 1fr);
  }

  .crm-activity-list time {
    grid-column: 2;
    grid-row: 2;
    text-align: left;
  }

  .crm-activity-list i {
    grid-column: 1;
    grid-row: 1 / span 2;
  }
}

/*
 * The control shell changes width independently of the browser viewport. Let
 * the CRM respond to the space it actually receives so the 841px shell state
 * cannot force desktop grids into a phone-width column.
 */
#crm-view .module-content {
  container-type: inline-size;
}

#crm-view .module-layout,
#crm-view [data-module-panel="crm"],
#crm-view .crm-page {
  min-height: 0;
}

#crm-intake {
  scroll-margin-top: 7rem;
}

.crm-signup-table td:first-child strong,
.crm-signup-table td:first-child small {
  display: block;
}

.crm-signup-table td:first-child small {
  margin-top: 0.18rem;
  color: var(--muted);
  font-size: 0.78rem;
}

.crm-signup-table td[data-status="confirmed"] {
  color: var(--crm-green);
  font-weight: 750;
}

.crm-signup-table td[data-status="pending_confirmation"] {
  color: var(--accent);
  font-weight: 750;
}

@container (max-width: 48rem) {
  .crm-page-header,
  .crm-source-bar,
  .crm-section-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .crm-source-actions {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .crm-source-actions .button {
    width: 100%;
    justify-content: center;
  }

  .crm-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .crm-overview-grid,
  .crm-record-split,
  .crm-workbench,
  .crm-action-pane {
    grid-template-columns: minmax(0, 1fr);
  }

  .crm-workbench {
    min-height: 0;
    overflow: visible;
  }

  .crm-queue-pane {
    border-right: 0;
    border-bottom: 1px solid var(--crm-line);
  }

  .crm-intake-list {
    display: flex;
    max-height: none;
    overflow-x: auto;
    scroll-snap-type: x proximity;
  }

  .crm-queue-item {
    width: min(18rem, 86cqw);
    min-width: min(18rem, 86cqw);
    border-right: 1px solid var(--crm-line);
    border-bottom: 0;
    scroll-snap-align: start;
  }

  .crm-queue-item[aria-pressed="true"] {
    box-shadow: inset 0 -2px 0 var(--crm-green);
  }

  .crm-detail-pane {
    border-right: 0;
    border-bottom: 1px solid var(--crm-line);
  }

  .crm-action-pane {
    grid-column: auto;
  }

  .crm-action-buttons {
    grid-template-columns: minmax(0, 1fr);
  }

  .crm-action-status {
    grid-column: auto;
  }

  .crm-lead-workspace {
    min-height: 0;
  }
}

@container (max-width: 28rem) {
  .crm-source-actions {
    grid-template-columns: minmax(0, 1fr);
  }
}