:root {
  /* Varumärke och domänfärger */
  --ink: #17211d;
  --muted: #65706a;
  --line: #e2e8e3;
  --soft: #f3f6f3;
  --surface: #ffffff;
  --green: #176f58;
  --green-dark: #0f4d3f;
  --customer: #2779d8;
  --customer-soft: #eaf3fe;
  --partner: #21865f;
  --partner-soft: #e8f5ef;
  --inner: #21865f;
  --inner-soft: #e8f5ef;
  --outer: #d97829;
  --outer-soft: #fff1e5;
  --upline: #d6a31f;
  --upline-soft: #fff8dd;
  --lead: #7b56b5;
  --lead-soft: #f2ecfa;
  --event: #7658cf;
  --event-soft: #f0ecfc;
  --cash: #118c68;
  --cash-soft: #e7f7f1;
  --danger: #c9404b;

  /* Semantisk typografi */
  --text-display: 40px;
  --text-page-title: 30px;
  --text-dialog-title: 30px;
  --text-section-title: 18px;
  --text-card-title: 16px;
  --text-body: 15px;
  --text-secondary: 13px;
  --text-label: 11px;
  --text-micro: 10px;
  --weight-regular: 500;
  --weight-strong: 720;
  --weight-heading: 780;
  --weight-label: 820;

  /* Återanvändbar spacing-skala */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --activity-detail-gap: var(--space-4);

  /* Form och elevation */
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 24px;
  --radius: var(--radius-lg);
  --shadow: 0 7px 22px rgba(31, 46, 39, 0.06);
  --shadow-dialog: 0 18px 48px rgba(15, 41, 33, 0.2);
}

* {
  box-sizing: border-box;
}

.event-step-counts,
.pipeline-track-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-2);
}

.event-step-counts > span {
  display: grid;
  gap: 2px;
  padding: var(--space-3);
  border-radius: var(--radius-md);
  background: var(--surface-soft);
  text-align: center;
}

.pipeline-track-actions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
html {
  width: 100%;
  max-width: 100%;
  min-height: 100%;
  overflow-x: clip;
  overflow-y: auto;
  background: #f7f9f6;
  color-scheme: light;
}
body {
  width: 100%;
  max-width: 100%;
  min-height: 100%;
  margin: 0;
  overflow-x: clip;
  overflow-y: visible;
  background: #f7f9f6;
  color: var(--ink);
  font-family:
    -apple-system,
    BlinkMacSystemFont,
    Segoe UI,
    Inter,
    Roboto,
    Helvetica,
    Arial,
    sans-serif;
  font-size: var(--text-card-title);
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
  overscroll-behavior-y: none;
}
html.overlay-scroll-locked,
body.overlay-scroll-locked {
  overflow: hidden;
  overscroll-behavior: none;
}
button,
input,
textarea,
select {
  font: inherit;
}
button {
  color: inherit;
  cursor: pointer;
}
button,
a,
select {
  -webkit-tap-highlight-color: transparent;
}
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 3px solid rgba(39, 121, 216, 0.28);
  outline-offset: 2px;
}
button:disabled {
  cursor: not-allowed;
}
.daily-splash {
  position: fixed;
  z-index: 1000;
  inset: 0;
  display: grid;
  place-items: center;
  min-height: 100dvh;
  padding: max(24px, env(safe-area-inset-top))
    max(24px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom))
    max(24px, env(safe-area-inset-left));
  background: #11715e;
}
.daily-splash img {
  display: block;
  width: min(78vw, 390px);
  height: auto;
  animation: pulse-splash-in 0.42s ease-out both;
}
.welcome-screen {
  position: fixed;
  z-index: 90;
  inset: 0;
  display: grid;
  place-items: center;
  min-height: 100dvh;
  padding: max(22px, env(safe-area-inset-top))
    max(18px, env(safe-area-inset-right))
    max(22px, env(safe-area-inset-bottom))
    max(18px, env(safe-area-inset-left));
  overflow-y: auto;
  background: linear-gradient(165deg, #11715e 0%, #0b594a 100%);
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.welcome-card {
  display: grid;
  width: min(100%, 430px);
  gap: var(--space-3);
  padding: clamp(22px, 6vw, 32px);
  border-radius: 26px;
  background: #fff;
  box-shadow: 0 24px 70px #063f353d;
}
.welcome-logo {
  display: block;
  width: min(58%, 220px);
  height: auto;
  margin-bottom: var(--space-1);
}
.welcome-card h1,
.welcome-card p,
.welcome-card ul {
  margin: 0;
}
.welcome-card h1 {
  color: var(--green-dark);
  font-size: clamp(28px, 8vw, 38px);
  line-height: 1.08;
}
.welcome-card > p,
.welcome-card li {
  color: #53615b;
  font-size: var(--text-body);
  line-height: 1.5;
}
.welcome-card ul {
  display: grid;
  gap: var(--space-2);
  padding-left: 22px;
}
.welcome-card li::marker {
  color: var(--green);
}
.welcome-card .welcome-profile-prompt {
  padding-top: var(--space-1);
  color: var(--ink);
  font-weight: 800;
}
.welcome-profile-button {
  margin-top: var(--space-1);
}
@keyframes pulse-splash-in {
  0% {
    opacity: 0;
    transform: scale(0.96);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
.app-shell {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 100dvh;
  background: #f7f9f6;
}
.app-canvas {
  position: relative;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 100dvh;
  margin: 0;
  padding: 0 16px calc(92px + env(safe-area-inset-bottom));
  overflow-x: clip;
  background: #f7f9f6;
}
.topbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4);
  padding: max(20px, env(safe-area-inset-top)) 2px 20px;
}
.home-topbar {
  padding-bottom: 18px;
}
.topbar h1 {
  margin: 5px 0 3px;
  font-size: var(--text-page-title);
  line-height: 1.08;
  letter-spacing: -0.045em;
  font-weight: 780;
}
.topbar-subtitle {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-body);
  line-height: 1.45;
}
.brandline {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin: 0 0 13px;
  color: var(--green);
  font-size: var(--text-secondary);
  letter-spacing: 0.13em;
  font-weight: 820;
}
.brand-mark {
  display: grid;
  place-items: center;
  width: 25px;
  height: 25px;
  border-radius: var(--radius-sm);
  background: var(--green);
  color: #fff;
  font-size: var(--text-secondary);
  letter-spacing: 0;
}
.brand-logo {
  display: block;
  width: 116px;
  max-width: 36vw;
  height: auto;
}
.eyebrow {
  margin: 0 0 5px;
  color: var(--green);
  font-size: var(--text-label);
  font-weight: 820;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}
.profile-button,
.add-top-button {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 50px;
  height: 50px;
  margin-top: 3px;
  border: 0;
  border-radius: var(--radius-lg);
}
.profile-button {
  position: relative;
  background: #dff0e8;
  color: var(--green-dark);
  font-size: var(--text-body);
  font-weight: 820;
}
.profile-button span {
  position: absolute;
  right: 1px;
  bottom: 1px;
  width: 13px;
  height: 13px;
  border: 3px solid #f7f9f6;
  border-radius: var(--radius-xl);
  background: #2bb673;
}
.add-top-button {
  background: var(--green);
  color: #fff;
  box-shadow: 0 8px 18px #176f5838;
}
.focus-card {
  display: grid;
  gap: var(--space-3);
  min-height: 164px;
  padding: var(--space-4);
  overflow: hidden;
  border-radius: var(--radius-xl);
  background:
    radial-gradient(
      circle at 91% 8%,
      rgba(116, 215, 178, 0.25),
      transparent 35%
    ),
    linear-gradient(135deg, #153f35, #176f58);
  color: #fff;
  box-shadow: 0 14px 31px #0f4d3f2e;
}
.focus-card.complete {
  background:
    radial-gradient(
      circle at 91% 8%,
      rgba(255, 255, 255, 0.2),
      transparent 35%
    ),
    linear-gradient(135deg, #17604c, #15956f);
}
.focus-main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}
.focus-copy {
  min-width: 0;
}
.focus-copy > p {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin: 0 0 12px;
  color: #c6eee2;
  font-size: var(--text-secondary);
  font-weight: 720;
}
.focus-copy h2 {
  margin: 0;
  font-size: var(--text-page-title);
  line-height: 1.1;
  letter-spacing: -0.035em;
}
.focus-heading-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}
.focus-message {
  display: block;
  width: 100%;
  overflow: visible;
  color: #ffffffdb;
  font-size: var(--text-secondary);
  line-height: 1.3;
  letter-spacing: -0.012em;
  white-space: nowrap;
}
.progress-ring {
  --progress: 0deg;
  position: relative;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 80px;
  height: 80px;
  margin-left: auto;
  border-radius: 50%;
  background: conic-gradient(
    #d2ffef var(--progress),
    rgba(255, 255, 255, 0.16) 0
  );
}
.progress-ring:after {
  content: "";
  position: absolute;
  inset: 7px;
  border-radius: inherit;
  background: #1b6855;
}
.complete .progress-ring:after {
  background: #168261;
}
.progress-ring > div {
  position: relative;
  z-index: 1;
  display: grid;
  text-align: center;
  line-height: 1;
}
.progress-ring strong {
  font-size: var(--text-section-title);
  letter-spacing: -0.05em;
}
.progress-ring small {
  margin-top: 5px;
  color: #ffffffc2;
  font-size: var(--text-label);
}
.content-section {
  margin: 14px 0;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
  box-shadow: var(--shadow);
}
.activity-section {
  margin-top: 16px;
}
.section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 62px;
  padding: 0 16px;
  border: 0;
  background: transparent;
  font-size: var(--text-section-title);
  font-weight: 760;
  text-align: left;
}
.section-meta {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  color: var(--muted);
  font-size: var(--text-secondary);
  font-weight: 680;
}
.rotate-icon {
  display: grid;
  place-items: center;
  transform: rotate(90deg);
  transition: transform 0.2s ease;
}
.rotate-icon.open {
  transform: rotate(-90deg);
}
.section-body {
  padding: 0 10px 12px;
}
.date-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  padding: 4px 7px 12px;
}
.date-heading > div {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
}
.date-heading span {
  font-size: var(--text-body);
  font-weight: 780;
}
.date-heading strong {
  color: var(--muted);
  font-size: var(--text-secondary);
}
.attention-label {
  padding: 6px 9px;
  border-radius: var(--radius-xl);
  background: #fff0ee;
  color: #b64a42;
  font-size: var(--text-label) !important;
  font-weight: 760 !important;
}
.activity-list {
  display: grid;
  gap: var(--space-2);
}
.activity-card {
  --activity-color: var(--event);
  position: relative;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-2);
  min-height: 92px;
  padding: 12px 10px 12px 12px;
  overflow: hidden;
  border: 1px solid #e8ede9;
  border-radius: var(--radius-lg);
  background: #fbfcfb;
}
.activity-card:before {
  content: "";
  position: absolute;
  inset: 10px auto 10px 0;
  width: 4px;
  border-radius: 0 5px 5px 0;
  background: var(--activity-color);
}
.activity-card.is-complete {
  background: #f4f7f4;
  opacity: 0.78;
}
.activity-check {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 2px solid #d3dad5;
  border-radius: var(--radius-sm);
  background: #fff;
  color: #fff;
}
.activity-check.checked {
  border-color: var(--green);
  background: var(--green);
}
.activity-main {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
  padding: 2px 0;
  border: 0;
  background: transparent;
  text-align: left;
}
.activity-context {
  display: flex;
  align-items: center;
  overflow: hidden;
  color: var(--muted);
  font-size: var(--text-secondary);
  font-weight: 680;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.activity-main strong {
  font-size: var(--text-body);
  line-height: 1.34;
  font-weight: 740;
}
.is-complete .activity-main strong {
  text-decoration: line-through;
  text-decoration-color: #929c96;
}
.activity-people {
  color: var(--green);
  font-size: var(--text-secondary);
  font-weight: 680;
}
.activity-arrow {
  display: grid;
  place-items: center;
  width: 34px;
  height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #96a09a;
}
.overdue-pill {
  align-self: flex-start;
  margin-top: 3px;
  padding: 6px 7px;
  border: 0;
  border-radius: var(--radius-sm);
  background: #fff0ee;
  color: #b4423d;
  font-size: var(--text-label);
  font-weight: 780;
  white-space: nowrap;
}
.tomorrow-block {
  margin-top: 10px;
  border-top: 1px solid var(--line);
}
.tomorrow-block .section-header {
  min-height: 58px;
  padding: 0 7px;
  font-size: var(--text-body);
}
.tomorrow-list {
  padding-bottom: 2px;
}
.empty-state {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-height: 78px;
  padding: var(--space-4);
  border: 1px dashed #d7e0da;
  border-radius: var(--radius-lg);
  color: var(--muted);
  text-align: center;
}
.empty-state p {
  margin: 0;
  font-size: var(--text-secondary);
  line-height: 1.4;
}
.empty-check {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 31px;
  height: 31px;
  border-radius: var(--radius-sm);
  background: #eaf6ef;
  color: var(--green);
}
.round-type {
  display: grid;
  place-items: center;
  width: 43px;
  height: 43px;
  border-radius: var(--radius-md);
}
.customer-bg {
  background: var(--customer-soft) !important;
  color: var(--customer) !important;
}
.partner-bg {
  background: var(--partner-soft) !important;
  color: #c66920 !important;
}
.lead-bg {
  background: var(--lead-soft) !important;
  color: var(--lead) !important;
}
.event-bg {
  background: var(--event-soft) !important;
  color: var(--event) !important;
}
.cash-bg {
  background: var(--cash-soft) !important;
  color: var(--cash) !important;
}
.lead-text {
  color: var(--lead);
}
.customer-text {
  color: var(--customer);
}
.partner-text {
  color: var(--partner);
}
.segmented-tabs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-1);
  margin-bottom: 15px;
  padding: var(--space-1);
  border-radius: var(--radius-md);
  background: #e7ece8;
}
.segmented-tabs button {
  min-height: 44px;
  padding: 0 4px;
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--muted);
  font-size: var(--text-secondary);
  font-weight: 740;
}
.segmented-tabs button.active {
  background: #fff;
  color: var(--ink);
  box-shadow: 0 3px 10px #1f2e2714;
}
.segmented-tabs .lead-tab.active {
  color: var(--lead);
}
.segmented-tabs .customer-tab.active {
  color: var(--customer);
}
.segmented-tabs .partner-tab.active {
  color: var(--partner);
}
.search-box {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-2);
  min-height: 56px;
  margin-bottom: 14px;
  padding: 0 15px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #fff;
  color: #7f8a83;
}
.search-box input {
  min-width: 0;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--ink);
  font-size: var(--text-card-title);
}
.search-clear-button {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  margin-right: -8px;
  border: 0;
  border-radius: var(--radius-md);
  background: transparent;
  color: var(--muted);
}
.search-clear-button:hover,
.search-clear-button:focus-visible {
  background: #f0f3f1;
  color: var(--ink);
}
.network-content {
  padding-bottom: 12px;
}
.list-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-4);
  margin-bottom: 14px;
  border: 0;
  border-radius: var(--radius-lg);
  color: #fff;
  box-shadow: 0 12px 26px #17302624;
}
.list-summary.lead-summary {
  background:
    radial-gradient(circle at 92% 5%, #b49ad746, transparent 38%),
    linear-gradient(135deg, #3c285d, #68498f);
}
.list-summary.customer-summary {
  background:
    radial-gradient(circle at 92% 5%, #8ec9ff42, transparent 38%),
    linear-gradient(135deg, #153d6a, #276eae);
}
.list-summary.partner-summary {
  background:
    radial-gradient(circle at 92% 5%, #8ee0bd3d, transparent 38%),
    linear-gradient(135deg, #173f32, #247456);
}
.summary-main {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  min-width: 0;
}
.big-count {
  font-size: var(--text-display);
  line-height: 1;
  font-weight: 790;
  letter-spacing: -0.06em;
}
.list-summary p {
  display: grid;
  gap: var(--space-1);
  margin: 0;
}
.list-summary p strong {
  font-size: var(--text-body);
}
.list-summary p small {
  color: #ffffffcf;
  font-size: var(--text-secondary);
  line-height: 1.35;
}
.attitude-distribution {
  grid-column: 1 / -1;
  height: 8px;
  margin-top: 4px;
  overflow: hidden;
  border-radius: var(--radius-xl);
  background: #ffffff28;
}
.attitude-distribution-fill {
  display: flex;
  min-width: 6px;
  height: 100%;
  overflow: hidden;
  border-radius: var(--radius-xl);
}
.attitude-distribution-fill i {
  min-width: 0;
  height: 100%;
  flex: 0 0 auto;
}
.simple-summary {
  border-color: var(--line);
  background: #fff;
}
.summary-add {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border: 0;
  border-radius: var(--radius-md);
  border: 1px solid #ffffff3d;
  background: #ffffff20;
  color: #fff;
  box-shadow: 0 6px 15px #13251f2b;
}
.summary-add.lead-add {
  background: var(--lead);
}
.summary-add.customer-add {
  background: var(--customer);
}
.summary-add.partner-add {
  background: var(--partner);
}
.legend-row {
  display: flex;
  gap: var(--space-4);
  padding: 14px 4px 9px;
  color: var(--muted);
  font-size: var(--text-secondary);
}
.legend-row span {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}
.legend-row i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}
.lead-list-controls {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  width: 100%;
  max-width: 100%;
  padding: 8px 0 10px;
}
.lead-list-controls button {
  min-width: 0;
  min-height: 46px;
  padding: 6px 5px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #fff;
  color: var(--muted);
  font-size: clamp(0.66rem, 2.7vw, var(--text-label));
  font-weight: 760;
  line-height: 1.15;
  overflow-wrap: anywhere;
}
.lead-track-filter.active {
  border-color: var(--lead-track-color);
  background: #f7f9f8;
  color: var(--lead-track-color);
  box-shadow: inset 0 -4px 0 var(--lead-track-color);
}
.lead-sort-button {
  color: var(--green-dark) !important;
  border-color: #b8d3c8 !important;
  background: #f2f8f5 !important;
}
.lead-customer-dot {
  background: var(--customer);
}
.lead-partner-dot {
  background: var(--partner);
}
.people-list {
  display: grid;
}
.spaced-list {
  margin-top: 12px;
}
.people-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-2);
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 79px;
  overflow: hidden;
  padding: 11px 4px;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: transparent;
  text-align: left;
}
.people-copy {
  display: grid;
  gap: var(--space-1);
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}
.people-copy strong {
  font-size: var(--text-body);
}
.people-copy > span,
.people-copy > small {
  overflow: hidden;
  color: var(--muted);
  font-size: var(--text-secondary);
  white-space: nowrap;
  text-overflow: ellipsis;
}
.stage-track {
  width: 100%;
  height: 4px;
  overflow: hidden;
  border-radius: var(--radius-xl);
  background: #e8ece9;
}
.stage-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
}
.goal-chip,
.branch-badge {
  padding: 6px 8px;
  border-radius: var(--radius-xl);
  font-size: var(--text-label);
  font-weight: 760;
}
.goal-chip.customer {
  background: var(--customer-soft);
  color: var(--customer);
}
.goal-chip.partner,
.branch-badge {
  background: var(--partner-soft);
  color: var(--partner);
}
.tiny-products {
  display: flex;
  gap: var(--space-1);
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}
.tiny-products i {
  flex: 0 0 auto;
  max-width: min(72vw, 260px);
  overflow: hidden;
  padding: 3px 6px;
  border-radius: var(--radius-sm);
  background: var(--customer-soft);
  color: var(--customer);
  font-size: var(--text-micro);
  font-style: normal;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.people-row > svg {
  color: #9ba49f;
}
.avatar {
  position: relative;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 45px;
  height: 45px;
  border-radius: var(--radius-md);
  font-size: var(--text-secondary);
  font-weight: 800;
}
.avatar-sm {
  width: 36px;
  height: 36px;
  border-radius: var(--radius-md);
  font-size: var(--text-label);
}
.avatar-lg {
  width: 58px;
  height: 58px;
  border-radius: var(--radius-lg);
  font-size: var(--text-card-title);
}
.avatar-lead {
  background: var(--lead-soft);
  color: var(--lead);
}
.avatar-customer {
  background: var(--customer-soft);
  color: var(--customer);
}
.avatar-partner {
  background: var(--partner-soft);
  color: var(--partner);
}
.avatar-outer-partner {
  background: var(--outer-soft);
  color: #bd611e;
}
.team-branches {
  display: grid;
  gap: var(--space-3);
  margin-top: 13px;
}
.root-branch {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #ffffffb3;
}
.root-branch.inner {
  border-color: #afd9c5;
  background: linear-gradient(180deg, var(--inner-soft), #fff 110px);
}
.root-branch.outer {
  border-color: #edc7a7;
  background: linear-gradient(180deg, var(--outer-soft), #fff 110px);
}
.root-branch-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  min-height: 52px;
  padding: 0 13px;
  border-bottom: 1px solid rgba(91, 108, 99, 0.11);
}
.root-branch-heading > div {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}
.root-branch-heading strong {
  font-size: var(--text-body);
}
.root-branch-heading > span {
  color: var(--muted);
  font-size: var(--text-secondary);
  font-weight: 700;
}
.root-branch-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
}
.root-branch.inner .root-branch-dot {
  background: var(--inner);
}
.root-branch.outer .root-branch-dot {
  background: var(--outer);
}
.team-tree {
  display: grid;
  gap: var(--space-2);
  padding-bottom: 8px;
}
.root-branch .team-tree {
  padding: var(--space-3);
}
.team-node {
  display: grid;
  gap: var(--space-2);
  margin: 0;
}
.team-person {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-2);
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 78px;
  overflow: hidden;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--root-leg-color);
  border-radius: var(--radius-md);
  background: #fff;
  text-align: left;
}
.team-person-copy {
  display: grid;
  gap: var(--space-1);
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}
.team-person strong {
  font-size: var(--text-body);
}
.team-person small {
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.35;
}
.team-person > svg {
  color: #9ca59f;
}
.team-position-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
  min-width: 0;
  max-width: 100%;
  margin-top: 2px;
}
.position-chip {
  padding: 3px 5px;
  border-radius: var(--radius-sm);
  font-size: var(--text-micro);
  font-style: normal;
  font-weight: 760;
  line-height: 1.2;
}
.position-chip.direct-inner {
  background: var(--inner-soft);
  color: #176b4d;
}
.position-chip.direct-outer {
  background: #fff2e8;
  color: #b45d1b;
}
.position-chip.root-inner {
  background: var(--inner-soft);
  color: #176b4d;
}
.position-chip.root-outer {
  background: var(--outer-soft);
  color: #ae5818;
}
.position-chip.side {
  background: #f0ebf8;
  color: #7553a0;
}
.team-spine {
  display: grid;
  gap: var(--space-2);
}
.team-spine-entry {
  display: grid;
  gap: var(--space-2);
}
.team-side-branch {
  display: grid;
  gap: var(--space-2);
  margin-left: 17px;
  padding-left: 10px;
  border-left: 2px solid
    color-mix(in srgb, var(--root-leg-color, #8a9a91) 34%, white);
}
.root-branch.inner .team-side-branch {
  border-left-color: color-mix(in srgb, var(--inner) 34%, white);
}
.root-branch.outer .team-side-branch {
  border-left-color: color-mix(in srgb, var(--outer) 34%, white);
}
.team-side-title {
  padding: 3px 0 0;
  color: #7553a0;
  font-size: var(--text-label);
  font-weight: 800;
  letter-spacing: 0.02em;
}
.team-side-branch .team-person {
  min-height: 72px;
  border-left-color: #9a79bd;
}
.team-side-branch .avatar {
  width: 38px;
  height: 38px;
  font-size: var(--text-secondary);
}
.team-children {
  display: grid;
  gap: var(--space-2);
  margin-left: 11px;
  padding-left: 9px;
  border-left: 2px solid color-mix(in srgb, var(--root-leg-color) 35%, white);
}
.team-child {
  display: grid;
  grid-template-columns: 37px minmax(0, 1fr);
  align-items: start;
  gap: var(--space-1);
}
.leg-label {
  padding-top: 12px;
  font-size: var(--text-label);
  font-weight: 790;
}
.team-child.direct-inner > .leg-label {
  color: #176b4d;
}
.team-child.direct-outer > .leg-label {
  color: #ad5a19;
}
.empty-leg {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-height: 47px;
  padding: 5px 10px;
  border: 1px dashed color-mix(in srgb, var(--root-leg-color) 45%, white);
  border-radius: var(--radius-md);
  background: #ffffffbf;
  color: #5e6862;
  font-size: var(--text-secondary);
  font-weight: 700;
  text-align: left;
}
.empty-leg.spine-add {
  min-height: 49px;
  justify-content: center;
}
.team-search-empty {
  border: 1px dashed var(--line);
  text-align: center;
}
.empty-root-leg {
  display: grid;
  justify-items: center;
  gap: var(--space-2);
  min-height: 124px;
  margin: var(--space-3);
  padding: var(--space-4);
  border: 1px dashed currentColor;
  border-radius: var(--radius-md);
  background: #ffffffad;
  text-align: center;
}
.root-branch.inner .empty-root-leg {
  color: var(--inner);
}
.root-branch.outer .empty-root-leg {
  color: #a95a20;
}
.empty-root-leg span {
  display: grid;
  place-items: center;
  width: 45px;
  height: 45px;
  border-radius: var(--radius-md);
  background: #fff;
}
.empty-root-leg strong {
  font-size: var(--text-body);
  line-height: 1.4;
}
.empty-root-leg small {
  color: var(--muted);
  font-size: var(--text-label);
}
.root-branch.inner .empty-leg.spine-add {
  --root-leg-color: var(--inner);
  color: var(--inner);
}
.root-branch.outer .empty-leg.spine-add {
  --root-leg-color: var(--outer);
  color: var(--outer);
}
.calendar-content {
  padding-bottom: 8px;
}
.calendar-card {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  padding: 15px 12px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #fff;
  box-shadow: var(--shadow);
}
.calendar-heading {
  display: grid;
  grid-template-columns: 44px 1fr 44px;
  align-items: center;
  min-width: 0;
  max-width: 100%;
  margin-bottom: 10px;
}
.calendar-heading h2 {
  margin: 0;
  font-size: var(--text-section-title);
  text-align: center;
}
.calendar-heading button {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: var(--radius-md);
  background: var(--soft);
  color: var(--muted);
}
.calendar-heading button:first-child svg {
  transform: rotate(180deg);
}
.weekday-row,
.calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  min-width: 0;
  max-width: 100%;
}
.weekday-row span {
  padding: 6px 0;
  color: #87918b;
  font-size: var(--text-label);
  font-weight: 760;
  text-align: center;
}
.calendar-grid > button,
.calendar-grid > span {
  min-width: 0;
  height: 47px;
}
.calendar-grid > button {
  display: grid;
  place-items: center;
  align-content: center;
  gap: var(--space-1);
  padding: 0;
  border: 0;
  border-radius: var(--radius-md);
  background: transparent;
  font-size: var(--text-secondary);
}
.calendar-grid > button.today span {
  display: grid;
  place-items: center;
  width: 27px;
  height: 27px;
  border-radius: var(--radius-sm);
  background: #e7f3ee;
  color: var(--green);
  font-weight: 780;
}
.calendar-grid > button.selected {
  background: #eef6f2;
  box-shadow: inset 0 0 0 1px #9bc7b9;
}
.calendar-grid button i {
  display: flex;
  gap: var(--space-1);
  height: 4px;
}
.calendar-grid button b {
  width: 4px;
  height: 4px;
  border-radius: 50%;
}
.event-type-legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-3);
  padding: 13px 4px;
  color: var(--muted);
  font-size: var(--text-label);
  line-height: 1.3;
}
.event-type-legend span {
  display: flex;
  align-items: center;
  gap: var(--space-1);
}
.event-type-legend i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
}
.upcoming-heading {
  margin: 12px 2px 8px;
}
.upcoming-heading h2 {
  margin: 2px 0 0;
  font-size: var(--text-section-title);
}
.event-list {
  display: grid;
  gap: var(--space-2);
}
.event-card {
  --event-color: var(--event);
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-3);
  width: 100%;
  min-height: 96px;
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-left: 4px solid var(--event-color);
  border-radius: var(--radius-lg);
  background: #fff;
  text-align: left;
  box-shadow: 0 4px 13px #1f2e2709;
}
.event-date-box {
  display: grid;
  place-items: center;
  align-content: center;
  width: 50px;
  height: 60px;
  border-radius: var(--radius-md);
  background: var(--soft);
}
.event-date-box strong {
  font-size: var(--text-section-title);
  line-height: 1;
}
.event-date-box span {
  margin-top: 4px;
  color: var(--muted);
  font-size: var(--text-label);
  text-transform: uppercase;
}
.event-copy {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
}
.event-copy > span {
  color: var(--event-color);
  font-size: var(--text-label);
  font-weight: 760;
}
.event-copy strong {
  overflow: hidden;
  font-size: var(--text-body);
  white-space: nowrap;
  text-overflow: ellipsis;
}
.event-copy small {
  overflow: hidden;
  color: var(--muted);
  font-size: var(--text-secondary);
  white-space: nowrap;
  text-overflow: ellipsis;
}
.event-copy i {
  color: var(--green);
  font-size: var(--text-label);
  font-style: normal;
  font-weight: 690;
}
.event-card > svg {
  color: #99a39d;
}
.settings-content {
  display: grid;
  gap: var(--space-4);
  padding-bottom: 10px;
}
.settings-intro {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-4);
  border-radius: var(--radius-lg);
  background: #eaf4ef;
  color: var(--green);
}
.settings-intro svg {
  flex: 0 0 auto;
}
.settings-intro p {
  margin: 0;
  color: #496d61;
  font-size: var(--text-secondary);
  line-height: 1.48;
}
.settings-group {
  display: grid;
  gap: var(--space-2);
}
.settings-group > .eyebrow {
  margin: 4px 3px 1px;
}
.settings-process-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-3);
  width: 100%;
  min-height: 72px;
  padding: 10px 13px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #fff;
  text-align: left;
}
.settings-process-card > div {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
}
.settings-process-card strong {
  font-size: var(--text-body);
}
.settings-process-card small {
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.35;
}
.settings-process-card > svg {
  color: #9ba49f;
}
.process-color {
  width: 10px;
  height: 43px;
  border-radius: var(--radius-sm);
}
.bottom-nav {
  position: fixed;
  z-index: 40;
  left: 0;
  right: 0;
  bottom: 0;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  width: 100%;
  min-height: calc(74px + env(safe-area-inset-bottom));
  padding: 7px 7px max(7px, env(safe-area-inset-bottom));
  border-top: 1px solid #dfe5e0;
  background: #fffffff7;
  box-shadow: 0 -8px 26px #1b2c2314;
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
}
.bottom-nav button {
  display: grid;
  place-items: center;
  align-content: center;
  gap: var(--space-1);
  min-width: 0;
  min-height: 58px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #7f8a84;
}
.bottom-nav button > span {
  display: grid;
  place-items: center;
  width: 40px;
  height: 36px;
  border-radius: var(--radius-md);
}
.bottom-nav small {
  max-width: 100%;
  overflow: hidden;
  font-size: var(--text-label);
  font-weight: 710;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.bottom-nav button.active {
  color: var(--green);
}
.bottom-nav button.active > span {
  background: #e6f2ed;
}
.bottom-nav .nav-add {
  color: var(--green);
}
.bottom-nav .nav-add > span {
  width: 40px;
  height: 36px;
  margin: 0;
  border: 0;
  border-radius: var(--radius-md);
  background: var(--green);
  color: #fff;
  box-shadow: 0 5px 13px #176f5838;
}
.sheet-layer {
  position: fixed;
  z-index: 100;
  inset: 0;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  width: 100%;
  max-width: 100vw;
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
  overscroll-behavior: none;
}
.sheet-backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  border: 0;
  background: #0d1b1580;
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}
.sheet {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  width: 100%;
  min-width: 0;
  max-width: 100%;
  max-height: 89dvh;
  overflow: hidden;
  border-radius: 24px 24px 0 0;
  background: #fff;
  box-shadow: 0 -12px 45px #12221a38;
  animation: sheet-in 0.24s ease-out;
}
.sheet-tall {
  height: 95dvh;
  max-height: 95dvh;
}
@keyframes sheet-in {
  0% {
    transform: translateY(35px);
    opacity: 0.4;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}
.sheet-handle {
  width: 43px;
  height: 5px;
  margin: 9px auto 3px;
  border-radius: var(--radius-sm);
  background: #d5dbd7;
}
.sheet-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  min-width: 0;
  min-height: 69px;
  padding: 11px 17px 12px;
  border-bottom: 1px solid var(--line);
}
.sheet-heading > div {
  min-width: 0;
}
.sheet-heading-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex: 0 0 auto;
  gap: var(--space-2);
  min-width: 0;
}
.sheet-status-badge {
  position: static;
  min-height: 30px;
  margin: 0;
  white-space: nowrap;
}
.sheet-heading h2 {
  margin: 0;
  font-size: var(--text-section-title);
  line-height: 1.15;
  letter-spacing: -0.035em;
  overflow-wrap: anywhere;
}
.sheet-heading .eyebrow {
  margin-bottom: 4px;
}
.sheet-heading-flow {
  display: block;
  min-height: 69px;
  overflow: visible;
}
.sheet-heading-flow-actions {
  float: right;
  margin: 0 -2px 4px 10px;
  transform: translateY(-13px);
}
.sheet-heading-flow .sheet-heading-copy {
  display: block;
  min-width: 0;
}
.sheet-heading-flow::after {
  display: block;
  clear: both;
  content: "";
}
.icon-button {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: var(--radius-md);
  background: #f0f3f1;
  color: #5f6a64;
}
.sheet-content {
  width: 100%;
  min-width: 0;
  min-height: 0;
  max-width: 100%;
  max-height: calc(89dvh - 86px);
  padding: 17px 17px calc(24px + env(safe-area-inset-bottom));
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
}
.sheet-tall .sheet-content {
  max-height: none;
}
.sheet:has(.sheet-footer) {
  grid-template-rows: auto auto minmax(0, 1fr) auto;
}
.sheet-footer {
  z-index: 4;
  display: grid;
  gap: var(--space-2);
  width: 100%;
  padding: var(--space-3) 17px calc(var(--space-3) + env(safe-area-inset-bottom));
  border-top: 1px solid var(--line);
  background: #fff;
  box-shadow: 0 -8px 22px #17332812;
}
.date-time-field {
  display: grid;
  gap: var(--space-2);
  color: #56625b;
  font-size: var(--text-secondary);
  font-weight: 700;
}
.date-time-field > button {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-2);
  width: 100%;
  min-height: 56px;
  padding: 0 13px;
  border: 1px solid #d9e0db;
  border-radius: var(--radius-md);
  background: #fafbfa;
  color: var(--green);
  text-align: left;
}
.date-time-field > button strong {
  color: var(--ink);
  font-size: var(--text-card-title);
  font-variant-numeric: tabular-nums;
}
.date-time-field > button svg:last-child {
  color: #87918b;
}
.date-time-layer {
  position: fixed;
  z-index: 220;
  inset: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: 100%;
  min-width: 0;
  max-width: 100vw;
  height: 100vh;
  height: 100dvh;
  max-height: 100dvh;
  min-height: 100svh;
  overflow: hidden;
  overscroll-behavior: none;
  isolation: isolate;
  background: #f7f9f6;
  color: var(--ink);
}
.date-time-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  min-width: 0;
  max-width: 100%;
  min-height: calc(76px + env(safe-area-inset-top));
  padding: max(16px, env(safe-area-inset-top)) 17px 12px;
  border-bottom: 1px solid var(--line);
  background: #fff;
}
.date-time-heading > div {
  min-width: 0;
}
.date-time-heading h2 {
  margin: 2px 0 0;
  font-size: var(--text-section-title);
  line-height: 1.15;
  letter-spacing: -0.035em;
  overflow-wrap: anywhere;
}
.date-time-content {
  display: grid;
  align-content: start;
  gap: var(--space-4);
  width: 100%;
  min-width: 0;
  min-height: 0;
  max-width: 100%;
  padding: var(--space-4);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
}
.date-time-layer .calendar-card {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  padding: 14px 8px 10px;
  border-radius: var(--radius-lg);
  box-shadow: 0 7px 22px #1f2e270f;
}
.date-time-layer .calendar-grid > button,
.date-time-layer .calendar-grid > span {
  height: 52px;
}
.date-time-layer .calendar-grid > button {
  font-size: var(--text-body);
}
.date-time-layer .calendar-grid > button.selected {
  background: #dcefe7;
  box-shadow: inset 0 0 0 2px var(--green);
  color: var(--green-dark);
  font-weight: 800;
}
.native-time-field {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 132px;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #fff;
}
.native-time-field > span {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: var(--space-1) var(--space-2);
  min-width: 0;
}
.native-time-field > span svg {
  grid-row: 1 / 3;
  color: var(--green);
}
.native-time-field > span strong {
  font-size: var(--text-body);
}
.native-time-field > span small {
  color: var(--muted);
  font-size: var(--text-label);
  font-weight: 500;
}
.native-time-field input {
  min-height: 52px;
  padding: 0 8px;
  background: #f4f7f5;
  text-align: center;
  font-size: var(--text-section-title);
  font-variant-numeric: tabular-nums;
}
.selected-date-time {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: 13px 14px;
  border-radius: var(--radius-md);
  background: #eaf4ef;
}
.selected-date-time span {
  color: #587268;
  font-size: var(--text-secondary);
}
.selected-date-time strong {
  color: var(--green-dark);
  font-size: var(--text-body);
  font-variant-numeric: tabular-nums;
}
.date-time-actions {
  display: grid;
  grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.3fr);
  gap: var(--space-2);
  width: 100%;
  min-width: 0;
  max-width: 100%;
  padding: 11px 16px max(11px, env(safe-area-inset-bottom));
  border-top: 1px solid var(--line);
  background: #fffffff7;
}
.activity-detail-meta {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin-bottom: 15px;
  color: var(--muted);
  font-size: var(--text-secondary);
}
.type-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
}
.picker-intro {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-3);
  margin-bottom: 11px;
}
.picker-intro p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: var(--text-secondary);
}
.field-label {
  margin: 0 !important;
  color: #76817a !important;
  font-size: var(--text-label) !important;
  font-weight: 800 !important;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}
.selection-count {
  flex: 0 0 auto;
  padding: 7px 9px;
  border-radius: var(--radius-sm);
  background: #edf4f0;
  color: var(--green);
  font-size: var(--text-secondary);
  font-weight: 740;
}
.person-picker-list {
  display: grid;
  gap: var(--space-2);
  margin-bottom: 16px;
}
.person-picker-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-2);
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 68px;
  overflow: hidden;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #fff;
  text-align: left;
}
.person-picker-row.selected {
  border-color: #7bb4a3;
  background: #f0f8f4;
}
.person-picker-row > span:not(.avatar) {
  display: grid;
  gap: var(--space-1);
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}
.person-picker-row strong {
  font-size: var(--text-body);
}
.person-picker-row small {
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.35;
}
.picker-progress {
  display: block;
  margin-top: 3px;
}
.picker-person-tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  margin-top: 3px;
}
.picker-person-tags i {
  max-width: 100%;
  overflow: hidden;
  padding: 3px 6px;
  border-radius: var(--radius-sm);
  background: var(--customer-soft);
  color: var(--customer);
  font-size: var(--text-micro);
  font-style: normal;
  font-weight: 720;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.picker-person-tags.partner i {
  background: var(--partner-soft);
  color: var(--partner);
}
.picker-person-tags.outer-partner i {
  background: var(--outer-soft);
  color: #ad5b1e;
}
.picker-check {
  display: grid;
  place-items: center;
  width: 29px;
  height: 29px;
  border: 2px solid #d3dad5;
  border-radius: var(--radius-sm);
  color: #fff;
}
.selected .picker-check {
  border-color: var(--green);
  background: var(--green);
}
.primary-button,
.secondary-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-height: 54px;
  padding: 0 16px;
  border-radius: var(--radius-md);
  font-size: var(--text-body);
  font-weight: 750;
}
.primary-button {
  border: 0;
  background: var(--green);
  color: #fff;
  box-shadow: 0 7px 17px #176f582e;
}
.primary-button:disabled {
  background: #bec7c1;
  box-shadow: none;
}
.secondary-button {
  border: 1px solid #d6ded8;
  background: #fff;
  color: var(--ink);
}
.full {
  width: 100%;
}
.sticky-action {
  position: sticky;
  bottom: 0;
}
.success-panel {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-4);
  border-radius: var(--radius-lg);
  background: #edf8f3;
}
.success-panel > span {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 45px;
  height: 45px;
  border-radius: var(--radius-md);
  background: var(--green);
  color: #fff;
}
.success-panel strong {
  font-size: var(--text-body);
}
.success-panel p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.4;
}
.muted-box {
  margin: 0;
  padding: var(--space-4);
  border-radius: var(--radius-md);
  background: var(--soft);
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.5;
}
.warning-box {
  margin: 0;
  padding: var(--space-3);
  border-radius: var(--radius-md);
  background: #fff1e9;
  color: #a95820;
  font-size: var(--text-secondary);
  line-height: 1.45;
}
.form-stack,
.detail-stack {
  display: grid;
  gap: var(--space-4);
  width: 100%;
  min-width: 0;
  max-width: 100%;
}
.form-stack label,
.detail-stack > label,
.editor-fields label,
.standalone-label,
.formula-inputs label {
  display: grid;
  gap: var(--space-2);
  color: #56625b;
  font-size: var(--text-secondary);
  font-weight: 700;
}
.form-stack label > span small {
  color: #8e9892;
  font-weight: 500;
}
input,
textarea,
select {
  width: 100%;
  min-height: 52px;
  padding: 0 13px;
  border: 1px solid #d9e0db;
  border-radius: var(--radius-md);
  outline: 0;
  background: #fafbfa;
  color: var(--ink);
  font-size: var(--text-card-title);
}
textarea {
  min-height: 88px;
  padding-top: 13px;
  resize: vertical;
}
select {
  appearance: auto;
}
.field-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-2);
}
.field-grid.single-field-grid {
  grid-template-columns: 1fr;
}
fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
legend {
  margin-bottom: 9px;
  color: #56625b;
  font-size: var(--text-secondary);
  font-weight: 700;
}
.choice-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-2);
}
.radio-card {
  position: relative;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: var(--space-2) !important;
  min-height: 76px;
  padding: var(--space-2);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #fff;
}
.radio-card:has(input:checked) {
  border-color: #76ad9c;
  background: #f1f8f5;
}
.radio-card.disabled {
  opacity: 0.48;
}
.radio-card input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}
.radio-icon {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: var(--radius-md);
}
.radio-card > span:last-child {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
}
.radio-card strong {
  color: var(--ink);
  font-size: var(--text-secondary);
}
.radio-card small {
  color: var(--muted);
  font-size: var(--text-label);
  line-height: 1.3;
}
.info-note {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2);
  padding: var(--space-3);
  border-radius: var(--radius-md);
  background: #edf6f2;
  color: var(--green);
}
.info-note svg {
  flex: 0 0 auto;
}
.info-note p {
  margin: 0;
  color: #4f6f64;
  font-size: var(--text-secondary);
  line-height: 1.48;
}
.danger-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-height: 48px;
  border: 0;
  background: transparent;
  color: var(--danger);
  font-size: var(--text-secondary);
  font-weight: 700;
}
.compact-form {
  gap: var(--space-3);
}
.profile-hero {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}
.profile-hero > div {
  flex: 1 1 0%;
  width: 0;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}
.profile-hero h3 {
  margin: 0 0 4px;
  overflow: hidden;
  font-size: var(--text-section-title);
  letter-spacing: -0.025em;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.profile-hero p {
  margin: 0;
  max-width: 100%;
  overflow: hidden;
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.4;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.profile-tags {
  display: flex;
  flex-wrap: nowrap;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin-top: 6px;
  padding-bottom: 2px;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.profile-tags::-webkit-scrollbar {
  display: none;
}
.profile-tags i {
  flex: 0 0 auto;
  max-width: min(72vw, 260px);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.profile-progress {
  margin-top: 8px;
}
.note-card {
  padding: 14px 15px;
  border-left: 4px solid var(--lead);
  border-radius: 5px 14px 14px 5px;
  background: var(--lead-soft);
  color: #754d5d;
  font-size: var(--text-secondary);
  line-height: 1.5;
}
.contact-strip {
  display: grid;
  padding: 0;
  overflow: hidden;
  border-radius: var(--radius-md);
  background: var(--soft);
  color: var(--muted);
}
.person-contact-overview > div {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: var(--space-3);
  min-height: 61px;
  padding: 10px 13px;
}
.person-contact-overview > div + div {
  border-top: 1px solid #dfe5e1;
}
.person-contact-overview > div > svg {
  color: var(--green);
}
.person-contact-overview span {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
}
.person-contact-overview small {
  font-size: var(--text-label);
  font-weight: 720;
}
.person-contact-overview strong {
  overflow: hidden;
  color: var(--ink);
  font-size: var(--text-secondary);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.track-switch,
.pipeline-track-summary {
  display: grid;
  gap: var(--space-2);
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
}
.pipeline-track-summary strong {
  color: var(--ink);
  font-size: var(--text-body);
}
.track-switch .choice-grid button {
  min-height: 46px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #fff;
  font-size: var(--text-secondary);
  font-weight: 730;
}
.track-switch .choice-grid button.active.customer {
  border-color: #8bb5e5;
  background: var(--customer-soft);
  color: var(--customer);
}
.track-switch .choice-grid button.active.partner {
  border-color: #8fc5b0;
  background: var(--partner-soft);
  color: var(--partner);
}
.track-switch .choice-grid button:disabled:not(.active) {
  opacity: 0.42;
}
.pipeline-track-helper {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-label);
  line-height: 1.45;
}
.track-switch > small {
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.45;
}
.process-timeline {
  display: grid;
  margin-top: 10px;
}
.timeline-step {
  position: relative;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: var(--space-3);
  min-height: 67px;
}
.timeline-step:before {
  content: "";
  position: absolute;
  left: 16px;
  top: 34px;
  bottom: 0;
  width: 2px;
  background: #e1e7e2;
}
.timeline-step:last-child:before {
  display: none;
}
.timeline-step > span {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 2px solid #d7ded9;
  border-radius: var(--radius-md);
  background: #fff;
  color: #8f9993;
  font-size: var(--text-label);
  font-weight: 760;
}
.timeline-step.done > span {
  border-color: var(--green);
  background: var(--green);
  color: #fff;
}
.timeline-step.current > span {
  border-color: var(--green);
  color: var(--green);
}
.timeline-step > div {
  padding: 2px 0 11px;
}
.timeline-step strong {
  font-size: var(--text-secondary);
  line-height: 1.35;
}
.timeline-step p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: var(--text-label);
  line-height: 1.4;
}
.detail-block {
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
}
.partner-placement-block {
  overflow: hidden;
  padding: 0;
}
.partner-placement-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  width: 100%;
  min-height: 69px;
  padding: 12px 14px;
  border: 0;
  background: transparent;
  text-align: left;
}
.partner-placement-toggle > span {
  display: grid;
  gap: var(--space-1);
}
.partner-placement-toggle h3 {
  margin: 0;
  font-size: var(--text-section-title);
}
.partner-placement-toggle > i {
  display: grid;
  place-items: center;
  color: var(--muted);
  transform: rotate(90deg);
  transition: transform 0.2s ease;
}
.partner-placement-block.expanded .partner-placement-toggle > i {
  transform: rotate(-90deg);
}
.partner-placement-content {
  padding: 0 14px 14px;
  border-top: 1px solid var(--line);
}
.placement-action-label {
  margin: 13px 0 8px;
  color: #56625b;
  font-size: var(--text-secondary);
  font-weight: 700;
}
.block-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 11px;
}
.block-heading h3 {
  margin: 3px 0 0;
  font-size: var(--text-section-title);
}
.block-heading > svg {
  color: var(--customer);
}
.block-heading.simple {
  margin-bottom: 8px;
}
.product-list {
  display: grid;
  gap: var(--space-2);
}
.product-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-2);
  min-height: 52px;
  padding: var(--space-2);
  border-radius: var(--radius-md);
  background: #f4f8fc;
}
.product-symbol {
  display: grid;
  place-items: center;
  width: 35px;
  height: 35px;
  border-radius: var(--radius-sm);
  background: var(--customer-soft);
  color: var(--customer);
}
.product-row strong {
  font-size: var(--text-secondary);
}
.product-row button {
  display: grid;
  place-items: center;
  width: 35px;
  height: 35px;
  border: 0;
  border-radius: var(--radius-sm);
  background: #fff;
  color: #7d8881;
}
.inline-add {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-2);
  margin-top: 10px;
}
.product-add-heading {
  margin: 17px 1px 0;
  color: var(--ink);
  font-size: var(--text-body);
  line-height: 1.35;
}
.inline-add select {
  min-height: 49px;
  background: #fff;
  color: var(--customer);
  font-weight: 680;
}
.inline-add button {
  min-height: 49px;
}
.zino-advice-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-4);
  border-radius: var(--radius-lg);
  background: var(--cash-soft);
}
.cash-icon {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 45px;
  height: 45px;
  border-radius: var(--radius-md);
  background: var(--cash);
  color: #fff;
}
.zino-advice-card strong {
  color: var(--cash);
  font-size: var(--text-card-title);
}
.zino-advice-card p {
  margin: 4px 0 0;
  color: #58776c;
  font-size: var(--text-secondary);
  line-height: 1.4;
}
.partner-opportunity .block-heading > svg {
  color: var(--partner);
}
.partner-opportunity > p {
  margin: 0 0 13px;
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.48;
}
.success-inline {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3);
  border-radius: var(--radius-md);
  background: #eaf6ef;
  color: var(--green);
  font-size: var(--text-secondary);
  font-weight: 740;
}
.leg-radio.inner .radio-icon {
  background: var(--inner-soft);
  color: var(--inner);
}
.leg-radio.outer .radio-icon {
  background: var(--outer-soft);
  color: var(--outer);
}
.leg-choice {
  min-height: 47px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #fff;
  font-size: var(--text-secondary);
  font-weight: 700;
}
.leg-choice.inner.active {
  border-color: #8bbde0;
  background: var(--inner-soft);
  color: #216fa7;
}
.leg-choice.outer.active {
  border-color: #e4a36f;
  background: var(--outer-soft);
  color: #af5816;
}
.leg-choice:disabled {
  opacity: 0.42;
}
.team-leg-selection {
  display: grid;
  gap: var(--space-2);
  padding: var(--space-3);
  border: 1px solid #e6c5a8;
  border-radius: var(--radius-lg);
  background: #fffaf5;
}
.team-leg-selection > p {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.4;
}
.event-detail-banner {
  --event-color: var(--event);
  display: grid;
  gap: var(--space-2);
  padding: var(--space-4);
  border-radius: var(--radius-lg);
  background: #f4f1fc;
  color: var(--event-color);
}
.event-detail-banner > span {
  font-size: var(--text-label);
  font-weight: 800;
  text-transform: uppercase;
}
.event-detail-banner h3 {
  margin: 2px 0 5px;
  color: var(--ink);
  font-size: var(--text-section-title);
  line-height: 1.2;
  letter-spacing: -0.03em;
}
.event-detail-banner p {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin: 0;
  color: #5e5578;
  font-size: var(--text-secondary);
}
.event-process-list {
  display: grid;
}
.event-process-row {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-2);
  min-height: 66px;
  padding: 8px 0;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: transparent;
  text-align: left;
}
.event-process-row:last-child {
  border-bottom: 0;
}
.mini-check {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border: 2px solid #d7ded9;
  border-radius: var(--radius-sm);
  color: #fff;
}
.event-process-row.done .mini-check {
  border-color: var(--green);
  background: var(--green);
}
.event-process-row > div {
  display: grid;
  gap: var(--space-1);
}
.event-process-row strong {
  font-size: var(--text-secondary);
  line-height: 1.35;
}
.event-process-row small {
  color: var(--muted);
  font-size: var(--text-label);
}
.event-process-row > svg {
  color: #98a29c;
}
.editor-steps {
  display: grid;
  gap: var(--space-2);
}
.editor-step {
  position: relative;
  display: grid;
  grid-template-columns: 29px minmax(0, 1fr) auto;
  align-items: start;
  gap: var(--space-2);
  padding: 12px 9px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #fafbfa;
}
.editor-index {
  display: grid;
  place-items: center;
  width: 29px;
  height: 29px;
  border-radius: var(--radius-sm);
  background: var(--event-soft);
  color: var(--event);
  font-size: var(--text-label);
  font-weight: 790;
}
.editor-fields {
  display: grid;
  gap: var(--space-2);
  min-width: 0;
}
.editor-fields input,
.editor-fields select {
  min-height: 47px;
  padding: 0 10px;
  background: #fff;
  font-size: var(--text-card-title);
}
.editor-delete {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: var(--radius-sm);
  background: #fff0f0;
  color: var(--danger);
}
.relationship-editor-step.partner {
  border-left: 4px solid var(--partner);
}
.relationship-editor-step.core {
  border-left: 4px solid var(--customer);
}
.editor-branch-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
}
.editor-branch-line select {
  width: auto;
  min-height: 40px;
  font-size: var(--text-secondary);
}
.branch-chip {
  padding: 5px 7px;
  border-radius: var(--radius-sm);
  font-size: var(--text-label);
  font-weight: 760;
}
.branch-chip.core {
  background: var(--customer-soft);
  color: var(--customer);
}
.branch-chip.partner {
  background: var(--partner-soft);
  color: var(--partner);
}
.branch-explainer {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-4);
  border-radius: var(--radius-lg);
  background: #f2f6fa;
}
.branch-explainer > span {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 43px;
  height: 43px;
  border-radius: var(--radius-md);
}
.branch-explainer strong {
  font-size: var(--text-body);
}
.branch-explainer p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.45;
}
.new-step-card {
  display: grid;
  gap: var(--space-3);
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-left-width: 4px;
  border-radius: var(--radius-lg);
  background: #fafbfa;
}
.new-step-card.core {
  border-left-color: var(--customer);
}
.new-step-card.partner {
  border-left-color: var(--partner);
}
.new-step-card .block-heading {
  margin-bottom: 0;
}
.formula-card {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-4);
  border-radius: var(--radius-lg);
  background: var(--cash-soft);
}
.formula-card strong {
  color: var(--cash);
  font-size: var(--text-body);
}
.formula-card p {
  margin: 4px 0 0;
  color: #557a6d;
  font-size: var(--text-secondary);
  line-height: 1.45;
}
.formula-inputs {
  display: grid;
  gap: var(--space-3);
}
.formula-inputs label small {
  color: var(--muted);
  font-size: var(--text-secondary);
  font-weight: 500;
  line-height: 1.45;
}
.formula-preview {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
}
.formula-preview > p {
  padding: 13px 14px 7px;
}
.formula-preview > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 45px;
  padding: 0 14px;
  border-top: 1px solid var(--line);
}
.formula-preview span {
  color: var(--muted);
  font-size: var(--text-secondary);
}
.formula-preview strong {
  color: var(--cash);
  font-size: var(--text-secondary);
}
.overdue-dialog {
  display: grid;
  justify-items: center;
  text-align: center;
}
.overdue-icon {
  display: grid;
  place-items: center;
  width: 62px;
  height: 62px;
  margin: 3px 0 12px;
  border-radius: var(--radius-lg);
  background: #fff0ee;
  color: #be5049;
}
.overdue-dialog h3 {
  margin: 0 0 8px;
  font-size: var(--text-section-title);
}
.overdue-dialog p {
  max-width: 330px;
  margin: 0 0 19px;
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.52;
}
.overdue-dialog .secondary-button {
  margin-top: 8px;
}
.add-menu-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-2);
}
.add-menu-grid button {
  display: grid;
  justify-items: start;
  min-height: 135px;
  padding: var(--space-4);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #fff;
  text-align: left;
}
.add-menu-grid button > span {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  margin-bottom: 13px;
  border-radius: var(--radius-md);
}
.add-menu-grid strong {
  font-size: var(--text-body);
}
.add-menu-grid small {
  margin-top: 4px;
  color: var(--muted);
  font-size: var(--text-secondary);
}
@media (max-width: 365px) {
  .app-canvas {
    padding-inline: 12px;
  }
  .topbar h1 {
    font-size: var(--text-page-title);
  }
  .focus-card {
    min-height: 150px;
    padding-inline: 17px 14px;
  }
  .focus-copy h2 {
    font-size: var(--text-section-title);
  }
  .focus-message {
    font-size: var(--text-secondary);
    letter-spacing: -0.025em;
  }
  .progress-ring {
    width: 70px;
    height: 70px;
  }
  .activity-card {
    grid-template-columns: 39px minmax(0, 1fr) auto;
  }
  .activity-main strong {
    font-size: var(--text-body);
  }
  .segmented-tabs button {
    font-size: var(--text-label);
  }
  .bottom-nav {
    padding-inline: 2px;
  }
  .bottom-nav small {
    font-size: var(--text-label);
  }
  .team-child {
    grid-template-columns: 34px minmax(0, 1fr);
  }
  .leg-label {
    font-size: var(--text-micro);
  }
  .editor-step {
    grid-template-columns: 27px minmax(0, 1fr);
  }
  .editor-delete {
    grid-column: 2;
    justify-self: end;
  }
}
.quick-status-heading {
  justify-content: space-between;
}
.quick-status-identity {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  min-width: 0;
}
.quick-status-identity > div {
  min-width: 0;
}
.owner-name-row {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-width: 0;
}
.owner-name-row h2 {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.owner-name-row button {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 29px;
  height: 29px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: var(--radius-sm);
  background: #ffffff1a;
  color: #dff4ec;
}
.achievement-badge {
  display: grid;
  place-items: center;
  align-content: center;
  flex: 0 0 auto;
  gap: var(--space-1);
  width: 61px;
  height: 61px;
  padding: var(--space-1);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: var(--radius-lg);
  background: #ffffff17;
  box-shadow: 0 8px 18px #02181138;
}
.achievement-badge.gold {
  color: #ffd35a;
  background: #ffc43921;
}
.achievement-badge.silver {
  color: #d9e0e3;
  background: #dce7eb1f;
}
.achievement-badge.bronze {
  color: #e7a167;
  background: #d37a3f24;
}
.achievement-badge.progress {
  color: #d8f3e8;
}
.achievement-badge strong {
  font-size: var(--text-section-title);
  line-height: 1;
  letter-spacing: -0.04em;
}
.achievement-badge small {
  color: currentColor;
  font-size: var(--text-micro);
  font-weight: 800;
  text-transform: uppercase;
}
.quick-status-label-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
}
.quick-status-label-row > small {
  color: #a8d2c3;
  font-size: var(--text-micro);
  font-weight: 720;
}
.achievement-detail {
  gap: var(--space-3);
}
.achievement-hero {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-4);
  border-radius: var(--radius-lg);
  background: linear-gradient(140deg, #173f34, #0d2f28);
  color: #fff;
}
.achievement-hero > span {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 67px;
  height: 67px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: var(--radius-lg);
  background: #ffffff17;
}
.achievement-hero.gold > span {
  color: #ffd35a;
}
.achievement-hero.silver > span {
  color: #d9e0e3;
}
.achievement-hero.bronze > span {
  color: #e7a167;
}
.achievement-hero.progress > span {
  color: #d8f3e8;
}
.achievement-hero > span strong {
  font-size: var(--text-section-title);
  letter-spacing: -0.05em;
}
.achievement-hero p,
.achievement-hero h3,
.achievement-hero small {
  margin: 0;
}
.achievement-hero p {
  color: #9ed5c2;
  font-size: var(--text-micro);
  font-weight: 820;
  letter-spacing: 0.11em;
}
.achievement-hero h3 {
  margin: 4px 0;
  font-size: var(--text-section-title);
}
.achievement-hero small {
  color: #c4ded5;
  font-size: var(--text-label);
}
.achievement-explanation {
  padding: var(--space-4);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #fff;
}
.achievement-explanation h3 {
  margin: 0 0 7px;
  font-size: var(--text-section-title);
}
.achievement-explanation p {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.55;
}
.achievement-levels {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-2);
  margin: 13px 0;
}
.achievement-levels span {
  display: flex;
  align-items: center;
  gap: var(--space-1);
  min-height: 43px;
  padding: 7px 8px;
  border-radius: var(--radius-md);
  background: var(--soft);
  color: #54605a;
  font-size: var(--text-label);
  font-weight: 760;
}
.achievement-levels .gold {
  color: #97700a;
  background: #fff7d8;
}
.achievement-levels .silver {
  color: #65727a;
  background: #eef2f3;
}
.achievement-levels .bronze {
  color: #9d5627;
  background: #fff0e6;
}
.owner-name-editor {
  padding-bottom: 5px;
}
.weekly-rhythm-bg {
  background: #eef1ff;
  color: #5966b2;
}
.rhythm-link-note.weekly {
  background: #eef1ff;
  color: #5966a0;
}
.rhythm-link-note.weekly svg {
  color: #6574c5;
}
.weekly-empty-state {
  border-color: #cbd2f0;
  color: #6671a8;
  background: #f8f9ff;
}
.activation-card {
  display: block;
  overflow: hidden;
  padding: 0;
}
.activation-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  width: 100%;
  min-height: 69px;
  padding: 12px 14px;
  border: 0;
  background: transparent;
  text-align: left;
}
.activation-toggle > span {
  display: grid;
  gap: var(--space-1);
}
.activation-toggle h3 {
  margin: 0;
  font-size: var(--text-section-title);
}
.activation-toggle > i {
  display: grid;
  place-items: center;
  color: var(--muted);
  transform: rotate(90deg);
  transition: transform 0.2s ease;
}
.activation-card.expanded .activation-toggle > i {
  transform: rotate(-90deg);
}
.activation-content {
  display: grid;
  gap: var(--space-3);
  padding: 13px 14px 14px;
  border-top: 1px solid var(--line);
}
.activation-content > p {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.48;
}
@media (max-width: 365px) {
  .quick-status-identity {
    gap: var(--space-2);
  }
  .quick-status-heading .avatar {
    width: 50px;
    height: 50px;
  }
  .quick-status-heading h2 {
    max-width: 140px;
    font-size: var(--text-section-title);
  }
  .achievement-badge {
    width: 55px;
    height: 55px;
    border-radius: var(--radius-lg);
  }
  .achievement-levels {
    grid-template-columns: 1fr;
  }
}
.settings-content {
  gap: var(--space-4);
}
.settings-quick-status {
  display: grid;
  gap: var(--space-4);
  padding: 18px 16px;
  overflow: hidden;
  border-radius: var(--radius-xl);
  background:
    radial-gradient(circle at 100% 0, #2b886f 0, transparent 38%),
    linear-gradient(145deg, #133f34, #0d2f28);
  color: #f6fffb;
  box-shadow: 0 12px 28px #0f44362e;
}
.quick-status-heading {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}
.quick-status-heading .avatar {
  flex: 0 0 auto;
  border: 2px solid rgba(255, 255, 255, 0.42);
  background: #e8f7f0;
  color: #145846;
}
.quick-status-heading .attitude-indicator {
  border-color: #174739;
}
.quick-status-heading .eyebrow {
  margin-bottom: 3px;
  color: #98d5bf;
}
.quick-status-heading h2 {
  margin: 0;
  color: #fff;
  font-size: var(--text-section-title);
  letter-spacing: -0.025em;
}
.quick-count-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-2);
}
.quick-count-grid > div {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
  padding: 10px 5px 9px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: var(--radius-md);
  background: #ffffff13;
  text-align: center;
}
.quick-count-grid strong {
  font-size: var(--text-section-title);
  line-height: 1;
}
.quick-count-grid span {
  overflow: hidden;
  color: #b8d8cc;
  font-size: var(--text-micro);
  font-weight: 700;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.quick-status-block {
  display: grid;
  gap: var(--space-2);
  padding: var(--space-3);
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: var(--radius-md);
  background: #ffffff0f;
}
.quick-status-label {
  margin: 0;
  color: #a8d2c3;
  font-size: var(--text-micro);
  font-weight: 820;
  letter-spacing: 0.1em;
}
.status-segmented-bar {
  display: flex;
  width: 100%;
  height: 9px;
  overflow: hidden;
  border-radius: var(--radius-xl);
  background: #ffffff24;
}
.status-segmented-bar i {
  display: block;
  min-width: 0;
  height: 100%;
}
.status-segmented-bar .positive,
.activity-day-legend i.positive {
  background: #45c889;
}
.status-segmented-bar .neutral,
.activity-day-legend i.neutral {
  background: #f2c94c;
}
.status-segmented-bar .negative,
.activity-day-legend i.negative {
  background: #e8666f;
}
.attitude-matrix {
  display: grid;
  grid-template-columns: minmax(76px, 1fr) repeat(3, 42px);
  align-items: center;
  row-gap: var(--space-2);
  font-size: var(--text-label);
  text-align: center;
}
.attitude-matrix > strong {
  color: #dceee7;
  font-size: var(--text-label);
  text-align: left;
}
.attitude-matrix > b {
  position: relative;
  color: #b8d8cc;
  font-size: var(--text-micro);
  font-weight: 740;
}
.attitude-matrix > b:before {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 3px;
  border-radius: 50%;
  content: "";
}
.attitude-matrix > b.positive:before {
  background: #45c889;
}
.attitude-matrix > b.neutral:before {
  background: #f2c94c;
}
.attitude-matrix > b.negative:before {
  background: #e8666f;
}
.attitude-matrix > span {
  color: #fff;
  font-weight: 780;
}
.quick-insight-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-2);
}
.quick-insight-grid > div {
  display: grid;
  gap: var(--space-1);
  min-height: 75px;
  padding: var(--space-3);
  border-radius: var(--radius-md);
  background: #f1fff9;
  color: #174b3e;
}
.quick-insight-grid strong {
  font-size: var(--text-section-title);
  line-height: 1;
}
.quick-insight-grid span {
  color: #55766c;
  font-size: var(--text-label);
  font-weight: 690;
  line-height: 1.25;
}
.contact-age-block {
  gap: 0;
  padding-block: 8px;
}
.contact-age-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 62px 62px;
  gap: var(--space-1);
  align-items: center;
  min-height: 29px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  font-size: var(--text-label);
}
.contact-age-row:first-child {
  border-top: 0;
}
.contact-age-row strong {
  font-size: var(--text-label);
}
.contact-age-row span {
  color: #d9ebe4;
  text-align: right;
}
.contact-age-row.header strong,
.contact-age-row.header span {
  color: #9fcbbd;
  font-size: var(--text-micro);
  font-weight: 800;
  letter-spacing: 0.06em;
}
.activity-day-legend {
  display: flex;
  justify-content: space-between;
  gap: var(--space-2);
}
.activity-day-legend span {
  display: flex;
  align-items: center;
  gap: var(--space-1);
  color: #e4f1ec;
  font-size: var(--text-label);
  font-weight: 720;
}
.activity-day-legend i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}
.tempo-section {
  display: grid;
  gap: var(--space-3);
}
.section-heading-row,
.settings-group-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-3);
}
.section-heading-row h2 {
  margin: 0;
  font-size: var(--text-section-title);
  letter-spacing: -0.025em;
}
.tempo-current,
.settings-group-heading > span {
  padding: 5px 9px;
  border-radius: var(--radius-xl);
  background: #e8f4ef;
  color: var(--green);
  font-size: var(--text-micro);
  font-weight: 790;
}
.tempo-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-2);
}
.tempo-grid button {
  display: grid;
  place-items: center;
  gap: var(--space-1);
  min-width: 0;
  min-height: 105px;
  padding: 10px 4px;
  border: 2px solid transparent;
  border-radius: var(--radius-lg);
  color: #fff;
  text-align: center;
  opacity: 0.72;
  transition:
    transform 0.16s ease,
    opacity 0.16s ease,
    box-shadow 0.16s ease;
}
.tempo-grid button.base {
  background: #55789f;
}
.tempo-grid button.active {
  background: #278469;
}
.tempo-grid button.intensive {
  background: #cc6243;
}
.tempo-grid button.active[aria-checked="true"],
.tempo-grid button[aria-checked="true"] {
  border-color: #fff;
  box-shadow:
    0 0 0 3px currentColor,
    0 9px 22px #18312729;
  opacity: 1;
  transform: translateY(-2px);
}
.tempo-grid button > span {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: var(--radius-md);
  background: #ffffff2e;
}
.tempo-grid strong {
  font-size: var(--text-body);
}
.tempo-grid small {
  overflow: hidden;
  width: 100%;
  font-size: var(--text-micro);
  font-weight: 690;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.settings-group-heading > .eyebrow {
  margin: 0 3px 1px;
}
.round-type.routine-bg {
  background: #fce8f0;
  color: #c54573;
}
.round-type.product-bg {
  background: #fff2df;
  color: #b66a1f;
}
.shared-rhythm-value {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3);
  border-radius: var(--radius-lg);
  background: #e9f5ef;
  color: var(--green-dark);
}
.shared-rhythm-value > span {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: var(--radius-md);
  background: #fff;
  color: var(--green);
}
.shared-rhythm-value > div {
  display: grid;
  gap: var(--space-1);
}
.shared-rhythm-value small {
  color: #648175;
  font-size: var(--text-micro);
  font-weight: 820;
  letter-spacing: 0.08em;
}
.shared-rhythm-value strong {
  font-size: var(--text-body);
}
.simple-editor-steps .editor-step {
  align-items: start;
}
.rhythm-link-note {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2);
  border-radius: var(--radius-md);
  background: #f3f6f4;
  color: #52635b;
  font-size: var(--text-label);
  font-weight: 680;
}
.rhythm-link-note svg {
  flex: 0 0 auto;
  color: var(--green);
}
.linked-onboarding-steps {
  overflow: hidden;
  border: 1px solid #dfe8e3;
  border-radius: var(--radius-lg);
  background: #f6faf8;
}
.linked-onboarding-steps > div {
  display: grid;
  grid-template-columns: 29px minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-2);
  min-height: 58px;
  padding: 8px 12px;
  border-top: 1px solid #e3ebe7;
}
.linked-onboarding-steps > div:first-child {
  border-top: 0;
}
.linked-onboarding-steps > div > span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: var(--radius-sm);
  background: var(--lead-soft);
  color: var(--lead);
  font-size: var(--text-label);
  font-weight: 800;
}
.linked-onboarding-steps > div > div {
  display: grid;
  gap: var(--space-1);
}
.linked-onboarding-steps strong {
  font-size: var(--text-secondary);
}
.linked-onboarding-steps small {
  color: var(--muted);
  font-size: var(--text-micro);
}
.linked-onboarding-steps svg {
  color: var(--green);
}
.monthly-timing-grid {
  align-items: end;
}
.contact-goal-panel {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: var(--space-3);
  margin-bottom: 13px;
  padding: var(--space-3);
  border: 1px solid #e3caee;
  border-radius: var(--radius-lg);
  background: #faf5fd;
}
.contact-goal-panel > span {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: var(--radius-md);
  background: #eadcf3;
  color: var(--lead);
}
.contact-goal-panel > span.goal-complete {
  background: #dbf2e6;
  color: var(--green);
}
.contact-goal-panel > div {
  display: grid;
  gap: var(--space-1);
}
.contact-goal-panel .field-label {
  margin: 0;
}
.contact-goal-panel strong {
  font-size: var(--text-body);
}
.contact-goal-panel small {
  color: var(--muted);
  font-size: var(--text-label);
}
.product-add-form label {
  display: grid;
  gap: var(--space-2);
}
.product-add-form label > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 50px;
  gap: var(--space-2);
}
.product-add-form label > div button {
  display: grid;
  place-items: center;
  border: 0;
  border-radius: var(--radius-md);
  background: var(--green);
  color: #fff;
}
.form-error {
  margin: 7px 0 0;
  color: var(--danger);
  font-size: var(--text-secondary);
  font-weight: 690;
}
.product-catalog-list {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #fff;
}
.product-catalog-list > div {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) 40px;
  align-items: center;
  gap: var(--space-2);
  min-height: 61px;
  padding: 7px 8px 7px 11px;
  border-top: 1px solid var(--line);
}
.product-catalog-list > div:first-child {
  border-top: 0;
}
.product-catalog-list > div > span {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: var(--radius-md);
  background: #fff2df;
  color: #b66a1f;
}
.product-catalog-list > div > div {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
}
.product-catalog-list strong {
  overflow: hidden;
  font-size: var(--text-body);
  white-space: nowrap;
  text-overflow: ellipsis;
}
.product-catalog-list small {
  color: var(--muted);
  font-size: var(--text-label);
}
.product-catalog-list button {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: var(--radius-md);
  background: #fff0f0;
  color: var(--danger);
}
.product-catalog-list button:disabled {
  background: #f0f2f1;
  color: #b5bbb7;
}
@media (max-width: 365px) {
  .settings-quick-status {
    padding-inline: 13px;
  }
  .quick-count-grid {
    gap: var(--space-1);
  }
  .quick-count-grid span {
    font-size: var(--text-micro);
  }
  .attitude-matrix {
    grid-template-columns: minmax(68px, 1fr) repeat(3, 38px);
  }
  .tempo-grid {
    gap: var(--space-1);
  }
  .tempo-grid button {
    min-height: 100px;
  }
  .tempo-grid small {
    font-size: var(--text-micro);
  }
}
.product-actions {
  display: flex;
  align-items: center;
  gap: var(--space-1);
}
.product-row .product-quantity-button {
  color: var(--customer);
}
.product-row .product-quantity-button:disabled {
  background: #edf0ee;
  color: #b7bdb9;
  cursor: not-allowed;
}
.product-row .product-delete-button {
  background: #fff0f0;
  color: var(--danger);
}
.avatar.inactive {
  background: #e1e4e2;
  color: #707772;
}
.attitude-indicator.attitude-inactive {
  display: grid;
  place-items: center;
  width: 17px;
  height: 17px;
  border-width: 2px;
  background: #424946;
  color: #cdd2cf;
}
.people-row.is-inactive,
.team-person.is-inactive,
.profile-hero.is-inactive {
  color: #747c77;
}
.people-row.is-inactive .people-copy,
.team-person.is-inactive .team-person-copy,
.profile-hero.is-inactive > div {
  opacity: 0.68;
}
.team-person.is-inactive {
  background: #f2f4f3;
}
.activation-card {
  display: grid;
  gap: var(--space-2);
  border-color: #d7dcda;
  background: #f8f9f8;
}
.activation-card h3 {
  margin: 0;
  font-size: var(--text-section-title);
}
.activation-card > p:not(.field-label) {
  margin: 0 0 4px;
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.48;
}
.deactivate-button,
.activate-button {
  min-height: 50px;
  border: 0;
  border-radius: var(--radius-md);
  font-size: var(--text-body);
  font-weight: 760;
}
.deactivate-button {
  background: #e8ebe9;
  color: #4f5853;
}
.activate-button {
  background: var(--green);
  color: #fff;
}
.activity-instructions {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: var(--space-2);
  margin-bottom: 13px;
  padding: var(--space-3);
  border: 1px solid #ebc6d5;
  border-radius: var(--radius-lg);
  background: #fff5f8;
  color: #7d3653;
}
.activity-instructions p {
  margin: 0;
  color: #654d57;
  font-size: var(--text-secondary);
  line-height: 1.5;
}
.routine-icon {
  display: grid;
  place-items: center;
  width: 39px;
  height: 39px;
  border-radius: var(--radius-md);
  background: #f7dce7;
  color: var(--lead);
}
.routine-postpone-setting {
  margin-bottom: 0;
  border-color: #ebc6d5;
  background: #fff5f8;
}
.root-branch.inner .team-side-title {
  color: var(--inner);
}
.root-branch.outer .team-side-title {
  color: #b45d1b;
}
.root-branch.inner .team-side-branch .team-person {
  border-left-color: var(--inner);
}
.root-branch.outer .team-side-branch .team-person {
  border-left-color: var(--outer);
}
.position-chip.side {
  background: var(--inner-soft);
  color: #176b4d;
}
@media (prefers-reduced-motion: reduce) {
  *,
  *:before,
  *:after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}
.activity-toolbar {
  display: grid;
  gap: var(--space-3);
  padding: 17px 16px 14px;
  border-bottom: 1px solid var(--line);
}
.activity-toolbar h2 {
  margin: 0;
  font-size: var(--text-section-title);
  letter-spacing: -0.025em;
}
.activity-filters {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-1);
}
.activity-filters button {
  --filter-color: var(--event);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-1);
  min-width: 0;
  min-height: 62px;
  padding: 7px 3px;
  border: 1px solid color-mix(in srgb, var(--filter-color) 35%, white);
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--filter-color) 11%, white);
  color: color-mix(in srgb, var(--filter-color) 80%, #17211d);
  font-size: var(--text-micro);
  font-weight: 780;
  line-height: 1.05;
  text-align: center;
  white-space: nowrap;
}
.activity-filters button > i {
  width: 9px;
  height: 9px;
  border-radius: var(--radius-xl);
  background: var(--filter-color);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--filter-color) 15%, transparent);
}
.activity-filters button small {
  color: color-mix(in srgb, var(--filter-color) 66%, #65706a);
  font-size: var(--text-micro);
  font-weight: 700;
}
.activity-filters button.hidden {
  border-style: dashed;
  background: #f5f7f5;
  color: #87908b;
  opacity: 0.72;
}
.activity-filters button.hidden > i {
  background: transparent;
  box-shadow: inset 0 0 0 2px #aeb7b1;
}
.activity-filters button.hidden small {
  color: #929a95;
}
.activity-days {
  display: grid;
  gap: 0;
  padding-top: 11px;
}
.activity-day {
  padding: 0 0 11px;
}
.activity-day + .activity-day {
  border-top: 1px solid var(--line);
}
.activity-day-heading,
.future-day-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  width: 100%;
  min-height: 52px;
  padding: 0 7px;
}
.activity-day-heading h3,
.future-day-heading h3 {
  margin: 0;
  font-size: var(--text-body);
  font-weight: 790;
}
.activity-day-heading h3 span,
.future-day-heading h3 span {
  margin-left: 4px;
  color: var(--muted);
  font-size: var(--text-secondary);
  font-weight: 680;
}
.activity-day-heading > strong {
  color: var(--green);
  font-size: var(--text-secondary);
  font-variant-numeric: tabular-nums;
}
.future-day-heading {
  border: 0;
  background: transparent;
  text-align: left;
}
.future-day-toggle {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  color: var(--muted);
}
.future-day-toggle small {
  display: grid;
  place-items: center;
  min-width: 25px;
  height: 25px;
  padding: 0 6px;
  border-radius: var(--radius-sm);
  background: var(--soft);
  font-size: var(--text-label);
  font-weight: 760;
}
.future-day-toggle i {
  display: grid;
  place-items: center;
  transform: rotate(90deg);
  transition: transform 0.2s ease;
}
.future-day-toggle i.expanded {
  transform: rotate(-90deg);
}
.future-list {
  padding-top: 2px;
}
.statistics-section {
  display: grid;
  gap: var(--space-2);
  margin: 22px 0 12px;
}
.statistics-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-3);
  padding: 0 2px;
}
.statistics-heading h2 {
  margin: 2px 0 0;
  font-size: var(--text-section-title);
  letter-spacing: -0.035em;
}
.statistics-heading > small {
  max-width: 140px;
  color: var(--muted);
  font-size: var(--text-label);
  line-height: 1.35;
  text-align: right;
}
.statistics-calendar .calendar-heading button:disabled,
.picker-calendar .calendar-heading button:disabled {
  opacity: 0.32;
}
.completion-grid > div,
.completion-grid > span {
  min-width: 0;
  height: 49px;
}
.completion-grid > div {
  display: grid;
  place-items: center;
  align-content: center;
  gap: var(--space-1);
  margin: var(--space-1);
  border: 2px solid transparent;
  border-radius: var(--radius-md);
  background: #f8faf8;
  font-size: var(--text-secondary);
  font-variant-numeric: tabular-nums;
}
.completion-grid > div small {
  color: var(--muted);
  font-size: var(--text-micro);
  font-weight: 760;
}
.completion-grid > div.today {
  box-shadow: inset 0 0 0 1px #9bc7b9;
}
.completion-grid > div.complete-green {
  border-color: #2f9d65;
  background: #e9f7ef;
  color: #177044;
}
.completion-grid > div.complete-yellow {
  border-color: #e1ad2c;
  background: #fff8dd;
  color: #8a6710;
}
.completion-grid > div.complete-red {
  border-color: #d85b62;
  background: #fff0f1;
  color: #9f343b;
}
.completion-grid > div.future {
  border-color: transparent;
  background: transparent;
  color: #b0b8b3;
  box-shadow: none;
}
.completion-grid > div.future small {
  display: none;
}
.completion-legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-3);
  margin-top: 11px;
  padding: 11px 3px 0;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: var(--text-label);
}
.completion-legend span {
  display: flex;
  align-items: center;
  gap: var(--space-1);
}
.completion-legend i {
  width: 9px;
  height: 9px;
  border: 2px solid;
  border-radius: var(--radius-sm);
}
.completion-legend .green {
  border-color: #2f9d65;
  background: #e9f7ef;
}
.completion-legend .yellow {
  border-color: #e1ad2c;
  background: #fff8dd;
}
.completion-legend .red {
  border-color: #d85b62;
  background: #fff0f1;
}
.picker-calendar .calendar-grid > button:disabled {
  color: #bdc4c0;
  opacity: 0.38;
}
.time-wheel-card {
  display: grid;
  gap: var(--space-3);
  padding: var(--space-4);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #fff;
}
.time-wheel-card > div:first-child {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  color: var(--green);
}
.time-wheel-card > div:first-child > span {
  display: grid;
  gap: var(--space-1);
}
.time-wheel-card > div:first-child strong {
  color: var(--ink);
  font-size: var(--text-body);
}
.time-wheel-card > div:first-child small {
  color: var(--muted);
  font-size: var(--text-label);
}
.time-wheel-selects {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: end;
  gap: var(--space-2);
}
.time-wheel-selects > span {
  padding-bottom: 17px;
  color: var(--green);
  font-size: var(--text-page-title);
  font-weight: 800;
}
.time-wheel-selects label {
  display: grid;
  gap: var(--space-2);
  color: var(--muted);
  font-size: var(--text-label);
  font-weight: 720;
}
.time-wheel-selects select {
  min-height: 62px;
  border-color: #bad6cb;
  background: #f0f7f4;
  color: var(--green-dark);
  font-size: var(--text-section-title);
  font-weight: 780;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.customer-core-fields {
  display: grid;
  gap: var(--space-2);
}
.customer-core-fields > div,
.customer-core-fields > label {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-1) var(--space-2);
  min-height: 66px;
  margin: 0;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #fff;
}
.customer-core-fields > div > span,
.customer-core-fields > label > span {
  grid-column: 1;
  color: var(--muted);
  font-size: var(--text-label);
  font-weight: 680;
}
.customer-core-fields > div > strong {
  grid-column: 1;
  font-size: var(--text-body);
  font-variant-numeric: tabular-nums;
}
.customer-core-fields > div > button {
  grid-column: 2;
  grid-row: 1 / 3;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: var(--radius-md);
  background: var(--customer-soft);
  color: var(--customer);
}
.customer-core-fields > label select {
  grid-column: 2;
  grid-row: 1 / 3;
  width: 164px;
  min-height: 44px;
  padding-inline: 10px;
  background: var(--customer-soft);
  color: var(--customer);
  font-size: var(--text-secondary);
  font-weight: 720;
}
.contact-today-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-height: 54px;
  border: 0;
  border-radius: var(--radius-md);
  background: #218c59;
  color: #fff;
  box-shadow: 0 7px 17px #218c5930;
  font-size: var(--text-body);
  font-weight: 760;
}
.contact-today-button.undo {
  background: var(--orange, #c96f18);
  box-shadow: 0 7px 17px #c96f1830;
}
.zino-schedule-card {
  align-items: start;
}
.zino-mini-timeline {
  grid-column: 1 / -1;
  display: grid;
  width: 100%;
  margin-top: 3px;
  overflow: hidden;
  border: 1px solid #bfe1d5;
  border-radius: var(--radius-md);
  background: #fff9;
}
.zino-mini-timeline > div {
  display: grid;
  grid-template-columns: 91px minmax(0, 1fr);
  gap: var(--space-2);
  min-height: 42px;
  padding: 8px 10px;
  border-top: 1px solid #d8ece5;
}
.zino-mini-timeline > div:first-child {
  border-top: 0;
}
.zino-mini-timeline span {
  color: var(--cash);
  font-size: var(--text-label);
  font-weight: 760;
  font-variant-numeric: tabular-nums;
}
.zino-mini-timeline strong {
  color: var(--ink);
  font-size: var(--text-label);
  line-height: 1.35;
}
.customer-history {
  display: grid;
  gap: var(--space-3);
}
.log-compose {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: var(--space-2);
}
.log-compose button {
  min-height: 43px;
  padding: 0 13px;
  border: 1px solid #b8d9cc;
  border-radius: var(--radius-md);
  background: #edf7f3;
  color: var(--green);
  font-size: var(--text-secondary);
  font-weight: 750;
}
.log-compose button:disabled {
  opacity: 0.45;
}
.history-table {
  display: grid;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
}
.history-row {
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr) 36px;
  align-items: center;
  gap: var(--space-2);
  min-height: 58px;
  padding: 8px 7px 8px 11px;
  border-top: 1px solid var(--line);
}
.history-row:first-child {
  border-top: 0;
}
.history-row time {
  color: var(--muted);
  font-size: var(--text-label);
  font-variant-numeric: tabular-nums;
}
.history-row > span {
  font-size: var(--text-secondary);
  line-height: 1.38;
}
.history-row button {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: var(--radius-sm);
  background: #fff0f0;
  color: var(--danger);
}
.confirm-layer {
  position: fixed;
  z-index: 320;
  inset: 0;
  display: grid;
  place-items: center;
  padding: var(--space-4);
  background: #0d1b158f;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.confirm-card {
  display: grid;
  justify-items: center;
  width: min(100%, 360px);
  max-height: calc(100dvh - 32px);
  overflow-y: auto;
  padding: var(--space-4);
  border-radius: var(--radius-lg);
  background: #fff;
  box-shadow: 0 20px 55px #0c181238;
  text-align: center;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.startup-error-layer {
  z-index: 1200;
}
.startup-error-card {
  align-items: stretch;
  justify-items: stretch;
  text-align: left;
}
.startup-error-card > h3,
.startup-error-card > p {
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}
.startup-error-icon {
  margin-right: auto;
  margin-left: auto;
  color: #9c5c13;
  background: #fff1d9;
}
.startup-diagnostic {
  display: grid;
  width: 100%;
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--line);
}
.startup-diagnostic p {
  display: grid;
  grid-template-columns: minmax(92px, 0.45fr) minmax(0, 1fr);
  gap: var(--space-2);
  margin: 0;
  padding: 10px 12px;
  background: #f8faf8;
  font-size: var(--text-label);
  line-height: 1.35;
}
.startup-diagnostic span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.startup-data-safe {
  color: var(--muted);
  font-size: var(--text-label);
  line-height: 1.4;
}
.startup-error-card > div:last-child,
.startup-error-card > div:last-child button {
  width: 100%;
}
.startup-error-card {
  gap: var(--space-3);
}
.startup-error-card > h3,
.startup-error-card > p {
  margin-bottom: 0;
}
.startup-issue-preview,
.startup-backup-confirmed,
.startup-reset-warning {
  width: 100%;
  padding: 10px 12px;
  border-radius: var(--radius-sm);
  font-size: var(--text-label);
  line-height: 1.4;
}
.startup-issue-preview {
  display: grid;
  gap: 4px;
  background: #fff6e6;
  color: #75501a;
}
.startup-issue-preview code,
.startup-repair-list code {
  min-width: 0;
  overflow-wrap: anywhere;
  color: inherit;
  font-size: var(--text-label);
  font-weight: 800;
}
.startup-backup-confirmed {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  background: #e6f6ee;
  color: var(--green-dark);
  font-weight: 800;
}
.startup-reset-warning {
  margin: 0;
  background: #fff0f0;
  color: var(--danger);
  font-weight: 750;
  text-align: left;
}
.startup-recovery-actions {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: var(--space-2);
  width: 100%;
}
.startup-recovery-actions > button {
  width: 100%;
}
.startup-password-form {
  display: grid;
  gap: var(--space-3);
  width: 100%;
}
.startup-password-form > p {
  margin: 0;
  text-align: left;
}
.startup-password-form label {
  display: grid;
  gap: var(--space-2);
  width: 100%;
  color: var(--muted);
  font-size: var(--text-label);
  font-weight: 750;
  text-align: left;
}
.startup-password-form input {
  width: 100%;
  min-height: 50px;
  padding: 0 13px;
  border: 1px solid #ccd8d2;
  border-radius: var(--radius-md);
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: var(--text-card-title);
}
.startup-password-form input:focus {
  border-color: var(--green);
  outline: 3px solid #d9eee6;
}
.startup-recovery-counts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-2);
  width: 100%;
}
.startup-recovery-counts span {
  display: grid;
  gap: 2px;
  padding: 8px 5px;
  border-radius: var(--radius-sm);
  background: #eef7f3;
  color: var(--muted);
  font-size: var(--text-micro);
  text-align: center;
}
.startup-recovery-counts strong {
  color: var(--green-dark);
  font-size: var(--text-card-title);
}
.startup-repair-list {
  display: grid;
  gap: var(--space-2);
  width: 100%;
  padding: 12px;
  border-radius: var(--radius-md);
  background: #eef7f3;
  color: var(--green-dark);
}
.startup-repair-list.is-blocked {
  background: #fff0f0;
  color: var(--danger);
}
.startup-repair-list > strong {
  text-align: left;
}
.startup-repair-list ul {
  display: grid;
  gap: 8px;
  max-height: 210px;
  margin: 0;
  padding: 0;
  overflow-y: auto;
  list-style: none;
}
.startup-repair-list li {
  display: grid;
  gap: 2px;
  padding-top: 7px;
  border-top: 1px solid currentColor;
  font-size: var(--text-label);
  line-height: 1.4;
}
.team-recovery-editor {
  display: grid;
  gap: var(--space-3);
  width: 100%;
  min-width: 0;
}
.team-recovery-editor > p {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.45;
  text-align: left;
}
.team-recovery-order {
  display: grid;
  gap: var(--space-2);
  width: 100%;
}
.team-recovery-row {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-2);
  min-width: 0;
  padding: 9px;
  border: 1px solid #cfe0d8;
  border-radius: var(--radius-md);
  background: #f5faf7;
}
.team-recovery-row > strong {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--ink);
  font-size: var(--text-secondary);
}
.team-recovery-number {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--green);
  color: #fff;
  font-size: var(--text-label);
  font-weight: 850;
}
.team-recovery-row > div {
  display: flex;
  gap: 5px;
}
.team-recovery-move {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  padding: 0;
  border: 1px solid #b8cec4;
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--green-dark);
  font-size: var(--text-card-title);
  font-weight: 850;
}
.team-recovery-move:disabled {
  opacity: 0.3;
}
.team-recovery-explanation {
  display: block;
  padding: 9px 10px;
  border-radius: var(--radius-sm);
  background: #eaf5f0;
  color: var(--green-dark);
  font-size: var(--text-label);
  line-height: 1.4;
  text-align: left;
  overflow-wrap: anywhere;
}
.post-reset-recovery-card {
  width: min(100%, 390px);
}
.post-reset-recovery-card > .full {
  width: 100%;
}
.confirm-card h3 {
  margin: 2px 0 8px;
  font-size: var(--text-section-title);
  line-height: 1.3;
}
.confirm-card p {
  margin: 0 0 18px;
  color: var(--muted);
  font-size: var(--text-secondary);
}
.confirm-card > div:last-child {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-2);
  width: 100%;
}
.selection-close-card .selection-close-actions {
  grid-template-columns: 1fr;
}
.selection-close-actions .primary-button,
.selection-close-actions .secondary-button,
.selection-close-actions .danger-button {
  width: 100%;
}
.password-dialog {
  gap: var(--space-2);
}
.password-dialog h3,
.password-dialog p {
  margin-bottom: 2px;
}
.password-dialog label {
  display: grid;
  gap: var(--space-2);
  width: 100%;
  color: var(--muted);
  font-size: var(--text-label);
  font-weight: 750;
  text-align: left;
}
.password-dialog input {
  width: 100%;
  min-height: 50px;
  padding: 0 13px;
  border: 1px solid #ccd8d2;
  border-radius: var(--radius-md);
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: var(--text-card-title);
}
.password-dialog input:focus {
  border-color: var(--green);
  outline: 3px solid #d9eee6;
}
.secure-dialog-icon {
  background: #e2f4ec;
  color: var(--green);
}
.dialog-field-hint,
.dialog-error {
  display: block;
  width: 100%;
  font-size: var(--text-label);
  line-height: 1.45;
  text-align: left;
}
.dialog-field-hint {
  color: var(--muted);
}
.dialog-error {
  padding: 8px 10px;
  border-radius: var(--radius-sm);
  background: #fff0f0;
  color: var(--danger);
  font-weight: 700;
}
.backup-ready-dialog {
  gap: var(--space-2);
}
.backup-file-name {
  display: block;
  max-width: 100%;
  overflow: hidden;
  padding: 9px 12px;
  border-radius: var(--radius-md);
  background: #eef7f3;
  color: var(--green-dark);
  font-size: var(--text-secondary);
  text-overflow: ellipsis;
  white-space: nowrap;
}
.restore-confirm-dialog {
  gap: var(--space-2);
}
.restore-dialog-icon {
  background: #fff0e4;
  color: #c25f1d;
}
.restore-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-2);
  width: 100%;
  margin: 3px 0;
}
.restore-summary span {
  display: grid;
  gap: var(--space-1);
  padding: var(--space-2);
  border-radius: var(--radius-md);
  background: #f3f7f5;
  color: var(--muted);
  font-size: var(--text-micro);
}
.restore-summary strong {
  color: var(--ink);
  font-size: var(--text-section-title);
}
.restore-exported-at {
  margin-bottom: 5px;
  color: var(--muted);
  font-size: var(--text-label);
}
.danger-button {
  min-height: 54px;
  border: 0;
  border-radius: var(--radius-md);
  background: var(--danger);
  color: #fff;
  font-size: var(--text-body);
  font-weight: 750;
}
.zino-fixed-customer {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-bottom: 14px;
  padding: var(--space-3);
  border-radius: var(--radius-lg);
  background: var(--cash-soft);
}
.zino-fixed-customer > div {
  display: grid;
  gap: var(--space-1);
}
.zino-fixed-customer small {
  color: var(--cash);
  font-size: var(--text-micro);
  font-weight: 800;
  letter-spacing: 0.09em;
}
.zino-fixed-customer strong {
  font-size: var(--text-body);
}
.zino-customer-row {
  grid-template-columns: auto minmax(0, 1fr);
  margin-bottom: 14px;
  padding: var(--space-3);
  border: 1px solid #cfe5dd;
  border-radius: var(--radius-lg);
  background: #f7fbf9;
}
.zino-customer-row .tiny-products {
  flex-wrap: wrap;
}
.zino-completion-panel {
  display: grid;
  gap: var(--space-2);
  margin-bottom: 12px;
  padding: var(--space-3);
  border: 1px solid #b8dccf;
  border-radius: var(--radius-lg);
  background: #f2faf7;
}
.zino-completion-panel label {
  display: grid;
  gap: var(--space-2);
  color: #56625b;
  font-size: var(--text-secondary);
  font-weight: 700;
}
.zino-completion-panel p:last-child {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-label);
  line-height: 1.45;
}
.subscription-checkbox {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: var(--space-3);
  margin-bottom: 12px;
  padding: var(--space-3);
  border: 1px solid #b8dccf;
  border-radius: var(--radius-lg);
  background: #f2faf7;
  color: var(--ink);
  font-size: var(--text-secondary);
  font-weight: 720;
  line-height: 1.4;
}
.subscription-checkbox input {
  width: 25px;
  min-height: 25px;
  margin: 0;
  accent-color: var(--green);
}
.postpone-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-height: 52px;
  margin-bottom: 9px;
  border: 1px solid #d77b2f;
  border-radius: var(--radius-md);
  background: #fff2e6;
  color: #a75016;
  font-size: var(--text-secondary);
  font-weight: 760;
}
.editor-help {
  color: var(--muted);
  font-size: var(--text-label);
  font-weight: 500;
  line-height: 1.45;
}
.zino-editor-steps {
  margin-top: 9px;
}
.zino-editor-steps .editor-step {
  border-left: 4px solid var(--cash);
}
.zino-editor-steps .editor-index {
  background: var(--cash-soft);
  color: var(--cash);
}
.attitude-indicator {
  position: absolute;
  right: -3px;
  bottom: -3px;
  width: 15px;
  height: 15px;
  border: 3px solid #fff;
  border-radius: 50%;
  box-shadow: 0 1px 4px #1b2a2329;
}
.attitude-negative {
  background: #d9545d;
}
.attitude-neutral {
  background: #e5b12e;
}
.attitude-positive {
  background: #2d9b62;
}
.add-names-goal {
  display: grid;
  gap: var(--space-3);
  margin-bottom: 12px;
}
.add-names-progress {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3);
  border: 1px solid #e6bfd0;
  border-radius: var(--radius-lg);
  background: #fff5f8;
}
.add-names-progress > span {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: var(--radius-md);
  background: #f7dce7;
  color: var(--lead);
}
.add-names-progress > span.goal-complete {
  background: #dff2e8;
  color: var(--green);
}
.add-names-progress > div {
  display: grid;
  gap: var(--space-1);
}
.add-names-progress strong {
  font-size: var(--text-card-title);
}
.add-names-progress small {
  color: var(--muted);
  font-size: var(--text-label);
  line-height: 1.35;
}
.add-names-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-height: 53px;
  border: 1px solid #d986a8;
  border-radius: var(--radius-md);
  background: #fff0f5;
  color: #aa3e69;
  font-size: var(--text-secondary);
  font-weight: 760;
}
.profile-edit-button {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  margin-left: auto;
  border: 0;
  border-radius: var(--radius-md);
  background: var(--customer-soft);
  color: var(--customer);
}
.profile-edit-button.lead {
  background: var(--lead-soft);
  color: var(--lead);
}
.profile-edit-button.partner {
  background: var(--partner-soft);
  color: var(--partner);
}
.profile-edit-button.outer-partner {
  background: var(--outer-soft);
  color: var(--outer);
}
.profile-edit-card {
  display: grid;
  gap: var(--space-3);
  padding: var(--space-3);
  border: 1px solid #bad4e8;
  border-radius: var(--radius-lg);
  background: #f5faff;
}
.profile-edit-card.profile-edit-lead {
  border-color: #d8c9ec;
  background: #faf7fd;
}
.profile-edit-card.profile-edit-partner {
  border-color: #b9ddcc;
  background: #f3faf7;
}
.profile-edit-card label {
  display: grid;
  gap: var(--space-2);
  color: #56625b;
  font-size: var(--text-secondary);
  font-weight: 700;
}
.profile-since-button {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-2);
  min-height: 61px;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #fff;
  color: var(--customer);
  text-align: left;
}
.form-since-button {
  width: 100%;
  background: #fafbfa;
}
.profile-edit-lead .profile-since-button {
  color: var(--lead);
}
.profile-edit-partner .profile-since-button {
  color: var(--partner);
}
.profile-since-button span {
  display: grid;
  gap: var(--space-1);
}
.profile-since-button small {
  color: var(--muted);
  font-size: var(--text-label);
  font-weight: 700;
}
.profile-since-button strong {
  color: var(--ink);
  font-size: var(--text-body);
  font-variant-numeric: tabular-nums;
}
.attitude-card {
  display: grid;
  gap: var(--space-3);
}
.attitude-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-2);
}
.attitude-options button {
  display: grid;
  place-items: center;
  gap: var(--space-2);
  min-height: 76px;
  padding: 8px 4px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #fafbfa;
  color: var(--muted);
  font-size: var(--text-label);
  font-weight: 720;
}
.attitude-options button > i {
  width: 22px;
  height: 22px;
  border: 4px solid #fff;
  border-radius: 50%;
  box-shadow: 0 0 0 1px #ccd3ce;
}
.attitude-options button.active {
  border-color: #8db4a6;
  background: #f0f7f4;
  color: var(--ink);
  box-shadow: inset 0 0 0 1px #8db4a6;
}
.people-copy > .person-meta-line {
  overflow: visible;
  white-space: normal;
  text-overflow: clip;
  line-height: 1.35;
}
.customer-product-statistics {
  display: grid;
  gap: var(--space-3);
  margin-top: 22px;
  padding: var(--space-4);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #fff;
}
.customer-statistics-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}
.customer-statistics-heading h2 {
  margin: 2px 0 0;
  font-size: var(--text-section-title);
  letter-spacing: -0.03em;
}
.customer-statistics-heading > svg {
  color: var(--customer);
}
.top-products-list {
  display: grid;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
}
.top-product-row {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-2);
  min-height: 51px;
  padding: 7px 11px 7px 8px;
  border-top: 1px solid var(--line);
}
.top-product-row:first-child {
  border-top: 0;
}
.top-product-row > span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: var(--radius-sm);
  background: var(--customer-soft);
  color: var(--customer);
  font-size: var(--text-label);
  font-weight: 800;
}
.top-product-row strong {
  overflow: hidden;
  font-size: var(--text-secondary);
  white-space: nowrap;
  text-overflow: ellipsis;
}
.top-product-row small {
  color: var(--muted);
  font-size: var(--text-label);
  font-weight: 700;
}
@media (max-width: 365px) {
  .activity-toolbar {
    padding-inline: 12px;
  }
  .activity-filters button {
    padding-inline: 2px;
    font-size: var(--text-micro);
  }
  .statistics-heading > small {
    max-width: 115px;
  }
  .completion-grid > div,
  .completion-grid > span {
    height: 45px;
  }
  .history-row {
    grid-template-columns: 76px minmax(0, 1fr) 34px;
  }
  .customer-core-fields > label select {
    width: 145px;
  }
}
.tempo-grid button.unselected {
  border-color: #c7cdca;
  background: #aeb5b1 !important;
  color: #f2f4f3;
  box-shadow: inset 0 0 0 1px #ffffff2e;
  filter: grayscale(1) saturate(0.1);
  opacity: 0.38;
  transform: scale(0.96);
}
.tempo-grid button.unselected > span {
  background: #ffffff1f;
}
.tempo-grid button.selected,
.tempo-grid button[aria-checked="true"] {
  border-color: #fff;
  box-shadow:
    0 0 0 3px currentColor,
    0 9px 22px #1831272e;
  filter: none;
  opacity: 1;
  transform: translateY(-2px) scale(1);
}
.advanced-settings {
  overflow: hidden;
  border: 1px solid #dbe3de;
  border-radius: var(--radius-lg);
  background: #fff;
  box-shadow: var(--shadow);
}
.advanced-settings-toggle {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-3);
  width: 100%;
  min-height: 76px;
  padding: 11px 13px;
  border: 0;
  background: #fff;
  text-align: left;
}
.advanced-settings-toggle > div {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
}
.advanced-settings-toggle strong {
  font-size: var(--text-card-title);
}
.advanced-settings-toggle small {
  color: var(--muted);
  font-size: var(--text-label);
}
.advanced-settings-toggle > svg {
  color: #8d9892;
  transition: transform 0.18s ease;
}
.advanced-settings.expanded .advanced-settings-toggle > svg {
  transform: rotate(90deg);
}
.settings-advanced-bg {
  background: #edf2ef;
  color: #506159;
}
.advanced-settings-content {
  display: grid;
  gap: var(--space-4);
  padding: 17px 13px 14px;
  border-top: 1px solid var(--line);
  background: #f8faf8;
}
.advanced-settings-content .settings-process-card {
  box-shadow: 0 3px 12px #182e2409;
}
.mini-add-button {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: var(--radius-md);
  background: var(--event-soft);
  color: var(--event);
}
.event-process-settings .settings-group-heading {
  align-items: center;
  margin-bottom: 2px;
}
.rhythm-editor-group {
  display: grid;
  gap: var(--space-3);
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #fafbfa;
}
.linked-rhythm-group {
  border-color: #d8e8e0;
  background: #f5faf7;
}
.custom-rhythm-group {
  border-color: #e5dced;
  background: #fbf8fd;
}
.rhythm-editor-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-3);
}
.rhythm-editor-heading .field-label {
  margin: 0 0 4px;
}
.rhythm-editor-heading small {
  color: var(--muted);
  font-size: var(--text-label);
  line-height: 1.35;
}
.linked-rhythm-group .rhythm-editor-heading > svg {
  color: var(--green);
}
.custom-rhythm-group .rhythm-editor-heading > svg {
  color: var(--lead);
}
.rhythm-editor-group .editor-steps {
  gap: var(--space-2);
}
.rhythm-editor-group .editor-step {
  background: #fff;
}
.rhythm-link-note.custom {
  background: var(--lead-soft);
  color: #665079;
}
.rhythm-link-note.custom svg {
  color: var(--lead);
}
.empty-custom-rhythms {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3);
  border: 1px dashed #d7c8e2;
  border-radius: var(--radius-md);
  color: #7e6b8d;
}
.empty-custom-rhythms p {
  margin: 0;
  font-size: var(--text-secondary);
}
.custom-process-identity {
  display: grid;
  gap: var(--space-2);
  padding: var(--space-3);
  border: 1px solid #ded6ed;
  border-radius: var(--radius-lg);
  background: #faf7ff;
}
.custom-process-identity small {
  color: var(--muted);
  font-size: var(--text-label);
}
@media (max-width: 365px) {
  .advanced-settings-content {
    padding-inline: 10px;
  }
  .advanced-settings-toggle {
    padding-inline: 11px;
  }
  .rhythm-editor-group {
    padding-inline: 10px;
  }
}
.quick-status-identity h2 {
  overflow: hidden;
  margin-right: 6px;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.profile-settings-bg {
  background: #e9f4ef;
  color: #27745d;
}
.profile-settings-editor {
  display: grid;
  gap: var(--space-4);
  padding-bottom: 5px;
}
.profile-settings-intro {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3);
  border: 1px solid #d8e8e0;
  border-radius: var(--radius-lg);
  background: #f3f9f6;
}
.profile-settings-intro > div:last-child {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
}
.profile-settings-intro strong,
.profile-settings-intro small {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.profile-settings-intro strong {
  font-size: var(--text-card-title);
}
.profile-settings-intro small {
  color: var(--muted);
  font-size: var(--text-secondary);
}
.data-settings-bg {
  background: #e8f1ff;
  color: #276fbf;
}
.data-settings-editor {
  display: grid;
  gap: var(--space-3);
  padding-bottom: 8px;
}
.data-settings-title {
  display: grid;
  gap: var(--space-1);
  padding: 0 2px 2px;
}
.data-settings-title .field-label,
.data-settings-title h3,
.data-settings-section h3,
.data-settings-section p {
  margin: 0;
}
.data-settings-title .field-label {
  color: var(--green);
}
.data-settings-title h3 {
  font-size: var(--text-section-title);
}
.data-settings-section {
  display: grid;
  gap: var(--space-3);
  padding: var(--space-4);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #fff;
}
.data-settings-section p {
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.55;
}
.data-settings-heading {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}
.data-settings-heading h3 {
  font-size: var(--text-section-title);
}
.data-section-icon {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  border-radius: var(--radius-md);
}
.backup-settings-section {
  border-color: #cfe4da;
  background: #f8fcfa;
}
.backup-icon {
  background: #e0f2e9;
  color: var(--green);
}
.reset-settings-section {
  border-color: #f0cccc;
  background: #fff8f8;
}
.reset-icon {
  background: #ffe7e7;
  color: var(--danger);
}
.test-settings-section {
  border-color: #efd9c7;
  background: #fffaf6;
}
.test-icon {
  background: #ffead8;
  color: #c6601b;
}
.data-settings-editor .example-data-button {
  background: #e77b2f;
  color: #fff;
  box-shadow: 0 7px 17px #c75c1733;
}
.data-settings-editor .future-button-toggle {
  border-color: #edc49f;
  background: #fff0e4;
  color: #a94f11;
}
.data-settings-editor .future-button-toggle.active {
  border-color: #d66a21;
  background: #e77b2f;
  color: #fff;
  box-shadow: 0 7px 17px #c75c1733;
}
.data-setting-divider {
  height: 1px;
  margin: 3px 0 1px;
  background: #eaded5;
}
.visually-hidden-file-input {
  position: fixed;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}
.profile-reset-block {
  display: grid;
  gap: var(--space-2);
  padding: var(--space-4);
  border: 1px solid #f0caca;
  border-radius: var(--radius-lg);
  background: #fff7f7;
}
.profile-reset-block .field-label,
.profile-reset-block h3,
.profile-reset-block p {
  margin: 0;
}
.profile-reset-block .field-label {
  color: var(--danger);
}
.profile-reset-block h3 {
  font-size: var(--text-section-title);
}
.profile-reset-block p:not(.field-label) {
  margin-bottom: 5px;
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.5;
}
.choice-grid.three-way {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.choice-grid.three-way .radio-card {
  grid-template-columns: 1fr;
  justify-items: center;
  min-height: 104px;
  text-align: center;
}
.choice-grid.three-way .radio-icon {
  width: 34px;
  height: 34px;
}
.track-text-options {
  gap: var(--space-2);
}
.track-text-choice {
  position: relative;
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 48px;
  padding: 8px 5px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #fff;
  text-align: center;
  cursor: pointer;
}
.track-text-choice input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}
.track-text-choice strong {
  color: var(--ink);
  font-size: var(--text-secondary);
  line-height: 1.2;
}
.track-text-choice.customer:has(input:checked) {
  border-color: #8bb5e5;
  background: var(--customer-soft);
}
.track-text-choice.customer:has(input:checked) strong {
  color: var(--customer);
}
.track-text-choice.undecided:has(input:checked) {
  border-color: #b9a2d7;
  background: var(--lead-soft);
}
.track-text-choice.undecided:has(input:checked) strong {
  color: var(--lead);
}
.track-text-choice.partner:has(input:checked) {
  border-color: #8fc5b0;
  background: var(--partner-soft);
}
.track-text-choice.partner:has(input:checked) strong {
  color: var(--partner);
}
.undecided-bg {
  background: var(--lead-soft);
  color: var(--lead);
}
.track-switch .choice-grid button.active.undecided {
  border-color: #b9a2d7;
  background: var(--lead-soft);
  color: var(--lead);
}
.lead-undecided-dot {
  background: var(--lead);
}
.picker-calendar .calendar-grid > button.recommended:not(.selected) {
  border-color: #78bfa3;
  background: #e9f7f0;
  color: #146c4c;
  box-shadow: inset 0 0 0 1px #78bfa3;
}
.meeting-booking-sheet,
.meeting-action-sheet {
  gap: var(--space-3);
}
.meeting-booking-sheet .activity-instructions,
.meeting-action-sheet .activity-instructions {
  margin-bottom: 0;
  border-color: #f0cda9;
  background: #fff8ef;
  color: #a65a1d;
}
.meeting-booking-sheet .activity-instructions p,
.meeting-action-sheet .activity-instructions p {
  color: #6e5540;
}
.person-picker-list.compact {
  max-height: none;
  overflow-y: visible;
}
.meeting-track-panel,
.contact-process-card,
.customer-enroll-panel {
  display: grid;
  gap: var(--space-2);
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #fff;
}
.meeting-track-panel > p,
.contact-process-card > p,
.customer-enroll-panel > p,
.customer-enroll-panel h3 {
  margin: 0;
}
.meeting-track-panel > p:not(.field-label) {
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.45;
}
.pipeline-next-step-card {
  border-color: #cfe1dd;
  background: #f7fbfa;
}
.pipeline-next-step-summary {
  display: grid;
  gap: var(--space-1);
}
.pipeline-next-step-summary strong {
  color: var(--ink);
  font-size: var(--text-card-title);
}
.pipeline-next-step-summary small {
  color: var(--muted);
  font-size: var(--text-label);
  line-height: 1.4;
}
.customer-partner-next-step {
  margin-bottom: var(--space-3);
}
.meeting-track-panel .choice-grid button {
  min-height: 48px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #fff;
  font-size: var(--text-secondary);
  font-weight: 760;
}
.meeting-track-panel .choice-grid button.active.customer {
  border-color: #8bb5e5;
  background: var(--customer-soft);
  color: var(--customer);
}
.meeting-track-panel .choice-grid button.active.partner {
  border-color: #8fc5b0;
  background: var(--partner-soft);
  color: var(--partner);
}
.meeting-track-panel .choice-grid button:disabled:not(.active) {
  opacity: 0.38;
}
.meeting-status-button {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-3);
  min-height: 68px;
  padding: var(--space-3);
  border: 1px solid #efd0ae;
  border-radius: var(--radius-lg);
  background: #fff8ef;
  color: #965419;
  text-align: left;
}
.meeting-status-button > span:first-child {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: var(--radius-md);
  background: #f8dfc3;
}
.meeting-status-button > span:nth-child(2) {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
}
.meeting-status-button strong,
.meeting-status-button small {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.meeting-status-button strong {
  color: var(--ink);
  font-size: var(--text-secondary);
}
.meeting-status-button small {
  color: #765f4b;
  font-size: var(--text-label);
}
.meeting-status-button.cancelled {
  border-color: #efc5c8;
  background: #fff4f4;
  color: var(--danger);
}
.meeting-status-button.cancelled > span:first-child {
  background: #f9dddd;
}
.cancelled-meeting-banner {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3);
  border: 1px solid #e1d8c8;
  border-radius: var(--radius-md);
  background: #faf7f1;
  color: #826d4a;
}
.cancelled-meeting-banner span {
  display: grid;
  gap: var(--space-1);
}
.cancelled-meeting-banner strong {
  color: var(--ink);
  font-size: var(--text-secondary);
}
.cancelled-meeting-banner small {
  color: var(--muted);
  font-size: var(--text-label);
  line-height: 1.4;
}
.scheduled-meeting-card {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-4);
  border: 1px solid #ead6bd;
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, #fffaf4, #fff4e7);
}
.scheduled-meeting-card > span {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: var(--radius-md);
  background: #f5dabb;
  color: #a65a1d;
}
.scheduled-meeting-card > div {
  display: grid;
  gap: var(--space-1);
}
.scheduled-meeting-card small {
  color: #996d45;
  font-size: var(--text-micro);
  font-weight: 790;
  letter-spacing: 0.08em;
}
.scheduled-meeting-card strong {
  font-size: var(--text-section-title);
  font-variant-numeric: tabular-nums;
}
.scheduled-meeting-card p {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-secondary);
}
.meeting-management-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-2);
}
.meeting-management-row button {
  min-height: 48px;
}
.cancel-meeting-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  border: 1px solid #efc7ca;
  border-radius: var(--radius-md);
  background: #fff5f5;
  color: var(--danger);
  font-size: var(--text-secondary);
  font-weight: 740;
}
.meeting-actions {
  display: grid;
  gap: var(--space-2);
}
.business-button {
  min-height: 52px;
  padding: 10px 14px;
  border: 0;
  border-radius: var(--radius-md);
  background: #6545a5;
  color: #fff;
  font-size: var(--text-secondary);
  font-weight: 760;
}
.enroll-products {
  display: grid;
  max-height: 230px;
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
}
.enroll-products label {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-height: 45px;
  padding: 9px 11px;
  background: #fff;
  font-size: var(--text-secondary);
}
.enroll-products label + label {
  border-top: 1px solid var(--line);
}
.enroll-products input {
  width: 20px;
  height: 20px;
  accent-color: var(--green);
}
.relationship-v19-editor {
  gap: var(--space-3);
}
.onboarding-definition-group {
  display: grid;
  gap: var(--space-2);
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #f8faf8;
}
.onboarding-definition-group.customer {
  border-color: #cfdef0;
  background: #f5f9fe;
}
.onboarding-definition-group.partner {
  border-color: #cde4d9;
  background: #f4faf7;
}
.onboarding-definition-group .editor-step {
  align-items: start;
}
.onboarding-definition-group .editor-fields > strong {
  font-size: var(--text-body);
}
.workflow-trigger,
.workflow-actions {
  display: block;
  padding: 7px 9px;
  border-radius: var(--radius-sm);
  font-size: var(--text-label);
  line-height: 1.35;
}
.workflow-trigger {
  background: #edf1ee;
  color: #5e6a63;
}
.workflow-actions {
  background: #fff3e6;
  color: #98561f;
  font-weight: 680;
}
.locked-dependency-setting {
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  gap: var(--space-2) !important;
  min-height: 43px;
  padding: 10px 12px;
  border: 1px solid #b8ddce;
  border-radius: var(--radius-md);
  background: #eef8f4;
  color: #246d55;
  font-size: var(--text-secondary);
  font-weight: 720;
}
.locked-dependency-setting input {
  width: 18px;
  height: 18px;
  accent-color: var(--green);
}
.first-delivery-follow-up-card {
  border-color: #e6c8a5;
  background: linear-gradient(135deg, #fffaf4, #fff5e9);
}
.first-delivery-follow-up-card > p {
  margin: 0 0 13px;
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.5;
}
@media (max-width: 370px) {
  .choice-grid.three-way {
    gap: var(--space-2);
  }
  .choice-grid.three-way .radio-card {
    min-height: 98px;
    padding: 8px 5px;
  }
  .choice-grid.three-way .radio-card small {
    display: none;
  }
  .legend-row {
    gap: var(--space-2);
  }
}

/* Pulze v34: campaign goals, sharing and compact add menu */
.add-menu-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.add-menu-grid .add-campaign-option,
.add-menu-grid .add-import-option {
  grid-column: auto;
  min-width: 0;
  min-height: 124px;
}
.campaign-goal-track i {
  background: #218e63;
}
.campaign-goal-card.reached {
  border-color: #91cbb1;
  background: #eff9f4;
}
.campaign-goal-card.reached .campaign-goal-heading > div strong,
.campaign-goal-card.reached .field-label {
  color: #176f58;
}
.campaign-goal-card.reached .campaign-goal-heading > span {
  background: #d9f1e6;
  color: #176f58;
}
.campaign-detail-banner.campaign-complete {
  border-color: #9bcdb9;
  background: #eff9f4;
}
.campaign-detail-banner.campaign-complete > p:last-child {
  color: #416e5d;
}
.campaign-complete-panel {
  border-color: #8fc9af;
  background: #eaf8f1;
  color: #155f4c;
}
.campaign-complete-panel > span {
  background: #218e63;
}
.campaign-failure-panel {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-4);
  border: 1px solid #d9d8e3;
  border-radius: var(--radius-lg);
  background: #f6f5f9;
  color: #535266;
}
.campaign-failure-panel > span {
  display: grid;
  place-items: center;
  width: 45px;
  height: 45px;
  border-radius: var(--radius-md);
  background: #e7e5ef;
  color: #6d6687;
}
.campaign-failure-panel strong {
  font-size: var(--text-body);
}
.campaign-failure-panel p {
  margin: 4px 0 0;
  font-size: var(--text-secondary);
  line-height: 1.45;
}
.event-card.campaign-card.is-complete {
  border-left-color: #218e63;
  background: #f1faf6;
}
.event-card.campaign-card.is-complete .event-date-box {
  background: #dff3e9;
  color: #176f58;
}
.event-card.campaign-card.is-complete .event-copy > span,
.event-card.campaign-card.is-complete .event-copy > i {
  color: #176f58;
}
.campaign-add-activity-button {
  justify-self: center;
  width: min(100%, 330px);
  margin-top: 2px;
}
.campaign-individual-goals {
  display: grid;
  gap: var(--space-2);
  padding: var(--space-3);
  border: 1px solid #d8e2dc;
  border-radius: var(--radius-md);
  background: #f7faf8;
}
.campaign-individual-goals > .field-label {
  margin: 0 0 2px;
}
.campaign-individual-goal-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-3);
  padding: 10px 11px;
  border: 1px solid #dbe5df;
  border-radius: var(--radius-md);
  background: #fff;
}
.campaign-individual-goal-row > strong {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--ink);
  font-size: var(--text-secondary);
  line-height: 1.35;
}
.campaign-individual-goal-row > span {
  display: flex;
  align-items: center;
  gap: var(--space-1);
  color: var(--green-dark);
  font-size: var(--text-secondary);
  font-weight: 820;
}
.campaign-individual-goal-row input {
  width: 68px;
  min-width: 68px;
  min-height: 43px;
  padding-inline: 8px;
  text-align: center;
}
.campaign-goal-and {
  justify-self: center;
  margin: -2px 0;
  color: var(--green-dark);
  font-size: var(--text-label);
  font-weight: 850;
  text-transform: uppercase;
}
.campaign-individual-goals > small {
  color: var(--muted);
  font-size: var(--text-label);
  line-height: 1.45;
}
.campaign-outcome-card {
  position: relative;
  display: grid;
  justify-items: center;
  gap: var(--space-2);
  min-width: 0;
  overflow: hidden;
  padding: 25px 18px 18px;
  border: 1px solid #d8dce0;
  border-radius: var(--radius-lg);
  background: #f8f8fa;
  text-align: center;
}
.campaign-outcome-card.success {
  border-color: #8fc9af;
  background: #eaf8f1;
  color: #155f4c;
}
.campaign-outcome-card.failure {
  border-color: #d9d8e3;
  background: #f6f5f9;
  color: #535266;
}
.campaign-outcome-icon {
  position: relative;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 68px;
  height: 68px;
  border-radius: var(--radius-xl);
  background: #e6e5ed;
  color: #6d6687;
}
.campaign-outcome-card.success .campaign-outcome-icon {
  background: #218e63;
  color: #fff;
  box-shadow: 0 12px 26px #218e6340;
}
.campaign-outcome-card .field-label,
.campaign-outcome-card h3,
.campaign-outcome-card p,
.campaign-outcome-card small,
.campaign-outcome-card button {
  position: relative;
  z-index: 2;
}
.campaign-outcome-card .field-label {
  margin: 3px 0 0;
}
.campaign-outcome-card.success .field-label,
.campaign-outcome-card.success h3 {
  color: #155f4c;
}
.campaign-outcome-card h3 {
  margin: 0;
  font-size: var(--text-section-title);
  line-height: 1.18;
}
.campaign-outcome-message {
  max-width: 520px;
  margin: 0;
  color: inherit;
  font-size: var(--text-secondary);
  line-height: 1.55;
}
.campaign-outcome-result {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
  padding: 9px 13px;
  border-radius: var(--radius-md);
  background: #fff;
}
.campaign-outcome-card.success .campaign-outcome-result {
  background: #d9f1e6;
}
.campaign-outcome-result strong {
  font-size: var(--text-section-title);
}
.campaign-outcome-result span,
.campaign-outcome-card > small {
  color: inherit;
  font-size: var(--text-label);
  line-height: 1.4;
}
.campaign-outcome-card .primary-button {
  margin-top: 7px;
}
.ended-heading {
  margin-top: 24px;
}
.ended-heading .eyebrow {
  color: #68736f;
}
.ended-campaign-list .event-card:not(.is-complete) {
  border-left-color: #8b8f91;
  background: #f7f7f7;
}
.ended-campaign-list .event-card:not(.is-complete) .event-date-box {
  background: #eceeef;
  color: #676d6b;
}
.campaign-celebration {
  position: absolute;
  inset: 0;
  z-index: 1;
  overflow: hidden;
  pointer-events: none;
}
.campaign-celebration.confetti i {
  position: absolute;
  top: -14px;
  left: var(--x);
  width: 8px;
  height: 15px;
  border-radius: var(--radius-sm);
  background: #218e63;
  animation: pulze-confetti-fall 2.15s var(--delay) ease-in both;
}
.campaign-celebration.confetti i:nth-child(3n + 2) {
  background: #62bd8f;
}
.campaign-celebration.confetti i:nth-child(3n) {
  background: #b8e3cf;
}
.campaign-celebration.fireworks i {
  position: absolute;
  top: var(--y);
  left: var(--x);
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #218e63;
  box-shadow: 0 0 0 5px #218e6320;
  animation: pulze-firework-pop 1.35s var(--delay) ease-out both;
}
.campaign-celebration.fireworks i:nth-child(2n) {
  background: #6fc49a;
}
@keyframes pulze-confetti-fall {
  0% {
    transform: translate3d(0, -20px, 0) rotate(0deg);
    opacity: 0;
  }
  12% {
    opacity: 1;
  }
  100% {
    transform: translate3d(var(--drift), 440px, 0) rotate(560deg);
    opacity: 0;
  }
}
@keyframes pulze-firework-pop {
  0% {
    transform: scale(0.1);
    opacity: 0;
  }
  25% {
    transform: scale(1.9);
    opacity: 1;
  }
  100% {
    transform: scale(0.55) translateY(36px);
    opacity: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .campaign-celebration i {
    animation: none !important;
    opacity: 0;
  }
}
@media (max-width: 370px) {
  .campaign-individual-goal-row {
    gap: var(--space-2);
  }
  .campaign-individual-goal-row input {
    width: 60px;
    min-width: 60px;
  }
}
.import-share-dialog,
.import-share-dialog > *,
.import-share-dialog .standalone-label {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}
.import-share-dialog textarea {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  font-size: var(--text-card-title);
  line-height: 1.45;
  overflow-x: hidden;
  resize: vertical;
  word-break: break-all;
  overflow-wrap: anywhere;
  -webkit-text-size-adjust: 100%;
}
.sheet-layer,
.sheet,
.sheet-content {
  max-width: 100%;
  overflow-x: clip;
}
.add-menu-grid .add-import-option,
.add-menu-grid .add-campaign-option {
  grid-column: auto;
  min-height: 124px;
}
.campaign-bg {
  background: #fff3d9 !important;
  color: #b46c0c !important;
}
.event-card.campaign-card {
  border-left-color: var(--event-color);
  background: linear-gradient(135deg, #fffaf0, #fff);
}
.event-card.campaign-card .event-date-box {
  background: #fff2d5;
  color: #a86208;
}
.campaign-type-preview {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: var(--space-3);
  min-width: 0;
  padding: var(--space-3);
  border: 1px solid #ecd4a8;
  border-radius: var(--radius-lg);
  background: #fffaf0;
}
.campaign-type-preview > span {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: var(--radius-md);
  background: #fff0cf;
  color: #af680a;
}
.campaign-type-preview > div {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
}
.campaign-type-preview strong {
  font-size: var(--text-body);
}
.campaign-type-preview small {
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.45;
}
.campaign-date-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  min-width: 0;
  padding: 13px 14px;
  border-radius: var(--radius-md);
  background: #f6f4ec;
}
.campaign-date-summary span {
  color: var(--muted);
  font-size: var(--text-secondary);
}
.campaign-date-summary strong {
  min-width: 0;
  font-size: var(--text-secondary);
  text-align: right;
}
.campaign-detail-banner {
  background: linear-gradient(135deg, #fff7e4, #fff);
}
.campaign-detail-banner > p:last-child {
  max-width: 620px;
  margin-top: 7px;
  color: #6f6250;
  line-height: 1.48;
}
.campaign-complete-panel {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-4);
  border: 1px solid #8fc9af;
  border-radius: var(--radius-lg);
  background: #eaf8f1;
  color: #155f4c;
}
.campaign-complete-panel > span {
  display: grid;
  place-items: center;
  width: 47px;
  height: 47px;
  border-radius: var(--radius-md);
  background: #218e63;
  color: #fff;
}
.campaign-complete-panel strong {
  font-size: var(--text-card-title);
}
.campaign-complete-panel p {
  margin: 4px 0 0;
  font-size: var(--text-secondary);
  line-height: 1.45;
}
.campaign-goal-card {
  display: grid;
  gap: var(--space-3);
  padding: var(--space-4);
  border: 1px solid #e5dcc7;
  border-radius: var(--radius-lg);
  background: #fffdf8;
}
.campaign-goal-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}
.campaign-goal-heading > div {
  display: grid;
  gap: var(--space-1);
}
.campaign-goal-heading p {
  margin: 0;
}
.campaign-goal-heading > span {
  padding: 7px 10px;
  border-radius: var(--radius-xl);
  background: #fff0cf;
  color: #9f5f0b;
  font-size: var(--text-secondary);
  font-weight: 800;
}
.campaign-goal-track {
  height: 10px;
  overflow: hidden;
  border-radius: var(--radius-xl);
  background: #eee9dc;
}
.campaign-goal-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #218e63;
  transition: width 0.25s ease;
}
.campaign-goal-card > small {
  color: var(--muted);
  font-size: var(--text-label);
  line-height: 1.45;
}
.campaign-subgoals {
  display: grid;
  gap: var(--space-2);
}
.campaign-subgoals > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  padding: 8px 10px;
  border-radius: var(--radius-sm);
  background: #f3f1ea;
  color: var(--muted);
  font-size: var(--text-label);
}
.campaign-subgoals > div.reached {
  background: #e7f5ee;
  color: var(--green-dark);
}
.campaign-process-list .event-process-row small {
  white-space: normal;
}
.campaign-type-editor,
.campaign-type-editor > *,
.campaign-type-editor label,
.campaign-type-editor input,
.campaign-type-editor select,
.campaign-type-editor textarea {
  min-width: 0;
  max-width: 100%;
}
.campaign-type-editor input,
.campaign-type-editor select,
.campaign-type-editor textarea {
  font-size: var(--text-card-title);
}
.campaign-editor-section {
  display: grid;
  gap: var(--space-3);
}
.campaign-editor-section .settings-group-heading {
  min-height: 44px;
}
.campaign-editor-steps {
  display: grid;
  gap: var(--space-3);
}
.campaign-activity-editor {
  min-width: 0;
  max-width: 100%;
}
.campaign-activity-editor .editor-fields {
  min-width: 0;
}
.campaign-activity-editor .field-grid {
  grid-template-columns: minmax(0, 1fr);
}
.campaign-relative-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.campaign-schedule-preview {
  margin: 0;
  padding: 9px 11px;
  border-radius: var(--radius-sm);
  background: #fff6e5;
  color: #965b0c;
  font-size: var(--text-label);
  font-weight: 760;
}
.campaign-measure-check {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3);
  border: 1px solid #c9ddcf;
  border-radius: var(--radius-md);
  background: #f1f8f4;
}
.campaign-measure-check input {
  width: 21px;
  height: 21px;
}
.campaign-measure-check span {
  display: grid;
  gap: var(--space-1);
}
.campaign-measure-check small {
  color: var(--muted);
  font-size: var(--text-label);
  line-height: 1.35;
}
.campaign-measure-check.disabled {
  border-color: #dfe3df;
  background: #f1f2f1;
  color: #8b938f;
}
.campaign-goal-editor {
  padding: var(--space-4);
  border: 1px solid #e4dcc9;
  border-radius: var(--radius-lg);
  background: #fffdf8;
}
.campaign-goal-mode {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-2);
  padding: var(--space-1);
  border-radius: var(--radius-md);
  background: #eeeae0;
}
.campaign-goal-mode button {
  min-height: 46px;
  padding: var(--space-2);
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--muted);
  font-size: var(--text-secondary);
  font-weight: 760;
}
.campaign-goal-mode button.active {
  background: #fff;
  color: #9f5f0b;
  box-shadow: 0 3px 10px #3b2d1514;
}
.danger-link:disabled {
  opacity: 0.42;
  cursor: not-allowed;
}
@media (max-width: 370px) {
  .campaign-relative-grid,
  .campaign-goal-mode {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .campaign-date-summary {
    align-items: flex-start;
    flex-direction: column;
  }
  .campaign-date-summary strong {
    text-align: left;
  }
}
.event-detail-banner {
  position: relative;
  padding-right: 76px;
}
.event-detail-banner.import-preview-banner {
  padding-right: 19px;
}
.event-share-button {
  position: absolute;
  top: 14px;
  right: 14px;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 1px solid color-mix(in srgb, var(--event-color) 24%, white);
  border-radius: var(--radius-md);
  background: #fff;
  color: var(--event-color);
  box-shadow: 0 7px 17px #221c411f;
}
.event-share-button:active {
  transform: translateY(1px);
}
.ongoing-heading {
  margin-top: 14px;
}
.ongoing-heading .eyebrow {
  color: #c45f23;
}
.ongoing-event-list {
  margin-bottom: 20px;
}
.event-card.is-ongoing {
  border-color: #efd0b8;
  border-left-color: var(--event-color);
  background: linear-gradient(135deg, #fff8f2, #fff);
}
.event-card.is-ongoing .event-copy > i {
  color: #b75b22;
}
.event-empty-state {
  min-height: 92px;
}
.import-bg {
  background: #eef0fb !important;
  color: #5f62bf !important;
}
.add-menu-grid .add-import-option {
  grid-column: auto;
  min-height: 124px;
}
.share-event-summary {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
  padding: var(--space-4);
  border: 1px solid color-mix(in srgb, var(--event-color) 24%, white);
  border-left: 4px solid var(--event-color);
  border-radius: var(--radius-lg);
  background: #f8f7fc;
}
.share-event-summary > span {
  color: var(--event-color);
  font-size: var(--text-label);
  font-weight: 820;
  text-transform: uppercase;
}
.share-event-summary > strong {
  overflow: hidden;
  font-size: var(--text-section-title);
  line-height: 1.25;
  text-overflow: ellipsis;
}
.share-event-summary > small {
  overflow: hidden;
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.45;
  text-overflow: ellipsis;
}
.share-code-field,
.import-share-dialog textarea {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  padding: 13px 14px;
  border: 1px solid #d8dfda;
  border-radius: var(--radius-md);
  background: #f7f9f7;
  color: #33413a;
  font-size: var(--text-secondary);
  line-height: 1.45;
  resize: vertical;
  overflow-wrap: anywhere;
}
.share-code-field {
  min-height: 112px;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
}
.import-share-dialog textarea {
  min-height: 180px;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
}
.share-status {
  margin: 0;
  padding: 11px 13px;
  border-radius: var(--radius-md);
  background: #e8f5ef;
  color: var(--green-dark);
  font-size: var(--text-secondary);
  font-weight: 740;
  text-align: center;
}
.text-button {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 14px;
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: var(--text-secondary);
  font-weight: 760;
}
.import-result-note {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3);
  border: 1px solid #bcd8cc;
  border-radius: var(--radius-md);
  background: #edf7f2;
  color: var(--green-dark);
}
.import-result-note.duplicate {
  border-color: #cfd7d2;
  background: #f1f3f2;
  color: #68736e;
}
.import-result-note > div {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
}
.import-result-note strong {
  font-size: var(--text-body);
}
.import-result-note small {
  color: inherit;
  font-size: var(--text-label);
  line-height: 1.4;
  opacity: 0.82;
}
.import-summary-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-2);
}
.import-summary-grid > span {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #fafbfa;
  color: var(--muted);
  font-size: var(--text-label);
}
.import-summary-grid strong {
  overflow: hidden;
  color: var(--ink);
  font-size: var(--text-body);
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (max-width: 370px) {
  .event-detail-banner {
    padding-right: 69px;
  }
  .event-share-button {
    top: 12px;
    right: 12px;
    width: 44px;
    height: 44px;
  }
  .share-event-summary > small {
    white-space: normal;
  }
}
.topbar > div:first-child {
  min-width: 0;
  flex: 1 1 auto;
}
.brandline-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: var(--space-2);
  margin: 0 0 13px;
}
.brandline-row .brandline {
  flex: 0 1 auto;
  margin: 0;
  white-space: nowrap;
}
.step-day-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-1);
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid #bcd8cc;
  border-radius: var(--radius-md);
  background: #edf7f2;
  color: var(--green-dark);
  font-size: var(--text-label);
  font-weight: 790;
  white-space: nowrap;
  box-shadow: 0 4px 10px #176f5814;
}
.step-day-button:active {
  transform: translateY(1px);
}
.follow-up-button,
.example-data-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-height: 54px;
  padding: 9px 15px;
  border: 0;
  border-radius: var(--radius-md);
  font-size: var(--text-secondary);
  font-weight: 770;
}
.follow-up-button {
  background: #e77b2f;
  color: #fff;
  box-shadow: 0 7px 17px #c75c1738;
}
.example-data-button {
  margin-top: 2px;
  background: #e9f5ef;
  color: var(--green-dark);
  box-shadow: inset 0 0 0 1px #bfddce;
}
.future-button-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-height: 50px;
  border: 1px solid #cdd6d2;
  border-radius: var(--radius-md);
  background: #f0f2f1;
  color: #68736f;
  font-weight: 800;
}
.future-button-toggle.active {
  border-color: #8cc6b2;
  background: #dff3ea;
  color: var(--green-dark);
  box-shadow: inset 0 0 0 1px #176f5814;
}
.profile-reset-block > small {
  color: #7b6969;
  font-size: var(--text-label);
  line-height: 1.45;
}
@media (max-width: 370px) {
  .topbar {
    gap: var(--space-2);
  }
  .step-day-button {
    padding-inline: 8px;
    font-size: var(--text-micro);
  }
}

/* Pulze v34 final cascade overrides */
.add-menu-grid .add-campaign-option,
.add-menu-grid .add-import-option {
  grid-column: auto;
  min-width: 0;
  min-height: 124px;
}
.campaign-goal-track i {
  background: #218e63;
}
.campaign-complete-panel {
  border-color: #8fc9af;
  background: #eaf8f1;
  color: #155f4c;
}
.campaign-complete-panel > span {
  background: #218e63;
  color: #fff;
}

/* Pulze v35: versionshanterade event, personval och deltagandestatistik */
.activity-parent-event {
  width: 100%;
  min-width: 0;
}
.activity-parent-event .event-card {
  width: 100%;
  min-width: 0;
  margin: 0;
  border-color: color-mix(in srgb, var(--event-color) 28%, var(--line));
  box-shadow: 0 8px 22px #163c3020;
}
.activity-parent-event .event-copy,
.activity-parent-event .event-copy > * {
  min-width: 0;
}
.activity-parent-event .event-copy > strong,
.activity-parent-event .event-copy > small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.grouped-person-picker {
  display: grid;
  gap: var(--space-3);
  overflow: visible;
}
.person-picker-group {
  display: grid;
  gap: var(--space-2);
  min-width: 0;
}
.person-picker-group-title {
  margin: 4px 2px 0;
  color: var(--muted);
  font-size: var(--text-micro);
  font-weight: 850;
  letter-spacing: 0.08em;
  line-height: 1.35;
}
.person-picker-row.locked {
  cursor: default;
}
.person-picker-row.locked:not(.selected) {
  opacity: 0.72;
}
.person-picker-add-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: var(--space-2);
  width: 100%;
  min-height: 51px;
  padding: 11px 14px;
  border: 1px dashed #81bca6;
  border-radius: var(--radius-md);
  background: #eff8f4;
  color: var(--green-dark);
  font-size: var(--text-secondary);
  font-weight: 820;
  text-align: left;
}
.additional-person-picker {
  display: grid;
  gap: var(--space-2);
  min-width: 0;
}
.additional-person-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  width: 100%;
  min-height: 52px;
  padding: 12px 2px;
  border: 0;
  background: transparent;
  color: var(--ink);
  text-align: left;
}
.additional-person-toggle svg {
  flex: 0 0 auto;
  transition: transform 0.2s ease;
}
.additional-person-picker.expanded .additional-person-toggle svg {
  transform: rotate(90deg);
}
.additional-person-content {
  display: grid;
  gap: var(--space-3);
  min-width: 0;
  padding: 0;
}
.new-previous-people-note {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: 11px 13px;
  border-radius: var(--radius-md);
  background: #fff2de;
  color: #9a561b;
  font-size: var(--text-secondary);
  font-weight: 780;
}
.activity-person-type-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-2);
}
.activity-person-type-grid > button {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  min-height: 56px;
  padding: 13px 15px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #f8faf9;
  color: var(--ink);
  text-align: left;
}
.event-process-editor .event-process-step {
  align-items: start;
}
.event-step-number-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.event-person-mode {
  min-width: 0;
  margin: 2px 0 0;
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
}
.event-person-mode legend {
  padding: 0 5px;
  color: var(--muted);
  font-size: var(--text-label);
  font-weight: 820;
}
.event-person-mode .choice-grid button {
  min-width: 0;
  min-height: 48px;
  padding: var(--space-2);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #f4f6f5;
  color: var(--muted);
  font-size: var(--text-label);
  font-weight: 760;
}
.event-person-mode .choice-grid button.active {
  border-color: #69aa93;
  background: #e4f4ed;
  color: var(--green-dark);
  box-shadow: inset 0 0 0 1px #69aa9340;
}
.event-person-type-checks {
  display: grid;
  gap: var(--space-2);
  margin-top: 10px;
}
.event-person-type-checks label {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-height: 42px;
  padding: 8px 10px;
  border-radius: var(--radius-md);
  background: #fff;
  font-size: var(--text-secondary);
  font-weight: 690;
}
.event-person-type-checks input {
  width: 19px;
  height: 19px;
}
.participation-source-settings {
  display: grid;
  gap: var(--space-2);
}
.versioning-note {
  border-color: #a9c9bb;
  background: #edf7f2;
}
.participation-history-card {
  display: grid;
  gap: var(--space-3);
  min-width: 0;
}
.participation-history-list {
  display: grid;
  gap: var(--space-2);
  min-width: 0;
}
.participation-history-list > button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  min-width: 0;
  min-height: 55px;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #fafcfb;
  color: var(--ink);
  text-align: left;
}
.participation-history-list > button > span {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
}
.participation-history-list strong,
.participation-history-list small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.participation-history-list small {
  color: var(--muted);
}
.event-statistics-section {
  display: grid;
  gap: var(--space-3);
  min-width: 0;
  margin-top: 22px;
}
.statistics-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.event-heatmap {
  display: grid;
  gap: var(--space-3);
  min-width: 0;
}
.event-heatmap-row {
  display: grid;
  gap: var(--space-2);
  min-width: 0;
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #fff;
  box-shadow: 0 5px 16px #173f3210;
}
.event-heatmap-label {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
  min-width: 0;
}
.event-heatmap-label strong,
.event-heatmap-label small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.event-heatmap-label small {
  color: var(--muted);
  font-size: var(--text-label);
}
.event-heatmap-timeline {
  display: flex;
  gap: var(--space-2);
  width: 100%;
  min-width: 0;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  padding: 1px 1px 5px;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}
.event-heatmap-cell {
  display: grid;
  place-items: center;
  flex: 0 0 51px;
  width: 51px;
  height: 51px;
  padding: var(--space-1);
  border: 1px solid #b8d1c7;
  border-radius: var(--radius-md);
  color: #153b31;
  font-size: var(--text-label);
}
.event-heatmap-cell small {
  font-size: var(--text-micro);
  font-weight: 760;
}
.event-heatmap-cell.unregistered {
  border-style: dashed;
  border-color: #aeb8b4;
  background: #eef1ef;
  color: #7b8581;
}
@media (max-width: 390px) {
  .event-step-number-grid {
    grid-template-columns: 1fr 1fr;
  }
  .event-step-number-grid > label:last-child {
    grid-column: 1 / -1;
  }
  .event-person-mode .choice-grid {
    grid-template-columns: 1fr;
  }
  .event-person-mode .choice-grid button {
    min-height: 44px;
  }
}

/* Pulze v36: versionskontroll, flerhändelsedelning och separat Upline */
:root {
  --upline: #a97500;
  --upline-dark: #704e00;
  --upline-soft: #fff3c4;
}

.event-topbar-actions {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  gap: var(--space-2);
}

.multi-share-top-button {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 50px;
  height: 50px;
  margin-top: 3px;
  padding: 0;
  border: 1px solid #cfc4ee;
  border-radius: var(--radius-lg);
  background: #f2eefc;
  color: var(--event);
}

.multi-share-top-button:active {
  transform: translateY(1px);
}

.multi-share-select,
.multi-import-preview,
.multi-share-result {
  min-width: 0;
  max-width: 100%;
}

.multi-event-list {
  display: grid;
  gap: var(--space-2);
  width: 100%;
  min-width: 0;
  max-width: 100%;
  max-height: none;
  overflow-x: clip;
  overflow-y: visible;
  padding: 2px 3px 5px;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.multi-share-primary-action {
  z-index: 3;
  bottom: calc(-1 * var(--space-2));
  box-shadow: 0 -7px 20px #17332814, 0 7px 17px #176f582e;
}

.selectable-event-card {
  grid-template-columns: 52px minmax(0, 1fr) 29px;
  min-width: 0;
  box-shadow: none;
}

.selectable-event-card.selected {
  border-color: color-mix(in srgb, var(--event-color) 48%, white);
  border-left-color: var(--event-color);
  background: color-mix(in srgb, var(--event-color) 7%, white);
  box-shadow: inset 0 0 0 1px
    color-mix(in srgb, var(--event-color) 18%, transparent);
}

.selectable-event-card.disabled {
  opacity: 0.62;
}

.multi-select-check {
  display: grid;
  place-items: center;
  width: 27px;
  height: 27px;
  border: 2px solid #cbd3ce;
  border-radius: var(--radius-sm);
  background: #fff;
  color: #fff;
}

.selectable-event-card.selected .multi-select-check {
  border-color: var(--event-color);
  background: var(--event-color);
}

.multi-share-summary {
  --event-color: var(--event);
  justify-items: center;
  padding-block: 21px;
  text-align: center;
}

.multi-share-summary > svg {
  color: var(--event);
}

.avatar-upline-partner {
  background: var(--upline-soft);
  color: var(--upline-dark);
}

.root-branch.upline {
  border-color: #e4c760;
  background: linear-gradient(180deg, var(--upline-soft), #fff 110px);
}

.root-branch.upline .root-branch-dot {
  background: var(--upline);
}

.upline-list {
  display: grid;
  gap: var(--space-2);
  min-width: 0;
  padding: var(--space-3);
}

.upline-person {
  --root-leg-color: var(--upline);
}

.position-chip.upline {
  background: var(--upline-soft);
  color: var(--upline-dark);
}

.picker-person-tags.upline-partner i {
  background: var(--upline-soft);
  color: var(--upline-dark);
}

.upline-add {
  --root-leg-color: var(--upline);
  justify-content: center;
  min-height: 49px;
  color: var(--upline-dark);
}

.upline-add-empty {
  color: var(--upline-dark);
}

.upline-add-empty small {
  color: var(--upline-dark);
}

.profile-edit-button.upline-partner {
  background: var(--upline-soft);
  color: var(--upline-dark);
}

.partner-relation-choice {
  display: grid;
  gap: var(--space-2);
  min-width: 0;
}

.partner-relation-choice .choice-grid button {
  min-width: 0;
  min-height: 52px;
  padding: var(--space-2);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #f5f7f5;
  color: var(--muted);
  font-size: var(--text-secondary);
  font-weight: 780;
}

.partner-relation-choice .choice-grid button.active.upline {
  border-color: #d3ad32;
  background: var(--upline-soft);
  color: var(--upline-dark);
  box-shadow: inset 0 0 0 1px #d3ad3240;
}

.partner-relation-choice .choice-grid button.active.downline {
  border-color: #75b59b;
  background: var(--partner-soft);
  color: var(--partner);
  box-shadow: inset 0 0 0 1px #75b59b40;
}

.partner-root-leg-choice .choice-grid button.active.inner {
  border-color: #75b59b;
  background: var(--partner-soft);
  color: var(--partner);
  box-shadow: inset 0 0 0 1px #75b59b40;
}

.partner-root-leg-choice .choice-grid button.active.outer {
  border-color: #e4a36f;
  background: var(--outer-soft);
  color: #af5816;
  box-shadow: inset 0 0 0 1px #e4a36f40;
}

.app-version-label {
  margin: -3px 0 4px;
  color: #8a938e;
  font-size: var(--text-label);
  font-variant-numeric: tabular-nums;
  text-align: center;
}

.update-dialog-icon {
  background: #e8f5ef;
  color: var(--green);
}

.update-dialog-layer {
  z-index: 1300;
}

.update-dialog > div:last-child {
  grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
}

@media (max-width: 370px) {
  .event-topbar-actions {
    gap: var(--space-2);
  }

  .multi-share-top-button,
  .event-topbar-actions .add-top-button {
    width: 46px;
    height: 46px;
    border-radius: var(--radius-md);
  }

  .selectable-event-card {
    grid-template-columns: 46px minmax(0, 1fr) 27px;
    gap: var(--space-2);
    padding: 10px 9px;
  }

  .selectable-event-card .event-date-box {
    width: 45px;
  }
}
.activity-next-action-meta {
  display: grid;
  gap: 2px;
  margin-top: 3px;
}

.activity-next-action-meta small {
  display: block;
  color: var(--muted);
  font-size: var(--text-micro);
  font-weight: 700;
}

/*
 * Semantiska komponentregler för v39. De ligger sist i bygget och samlar
 * avsiktligt samma presentation utan att göra en visuell redesign.
 */
.topbar h1,
.sheet-heading h2,
.confirm-card h3 {
  font-weight: var(--weight-heading);
}

.topbar h1,
.sheet-heading h2 {
  font-size: var(--text-page-title);
}

.section-header,
.data-settings-heading h3,
.settings-group-title,
.card-section-title {
  font-size: var(--text-section-title);
  font-weight: var(--weight-strong);
}

.eyebrow,
.field-label,
.brandline,
.settings-kicker {
  font-size: var(--text-label);
  font-weight: var(--weight-label);
  letter-spacing: 0.13em;
}

.topbar-subtitle,
.activity-context,
.person-subtitle,
.dialog-field-hint,
.muted-box {
  font-size: var(--text-secondary);
}

.content-section,
.data-settings-section,
.settings-card {
  border-color: var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
}

.primary-button,
.secondary-button,
.danger-button,
.follow-up-button,
.example-data-button {
  min-height: 48px;
  border-radius: var(--radius-md);
  font-weight: var(--weight-strong);
}

.confirm-card {
  box-shadow: var(--shadow-dialog);
}

/* v39: mötesobjektets gemensamma 3-partsflöde */
.three-party-dialog,
.meeting-booked-confirmation,
.meeting-partners-card,
.meeting-partner-list,
.meeting-partner-picker {
  min-width: 0;
  max-width: 100%;
}

.three-party-dialog .activity-instructions {
  margin: 0;
}

.test-privacy-note {
  font-weight: 700;
}

.meeting-person-row {
  cursor: default;
}

.meeting-person-row.is-inactive {
  border-color: #d8dcda;
  background: #f1f3f2;
  color: #68716d;
}

.meeting-partner-list {
  display: grid;
  gap: var(--space-2);
}

.meeting-partner-list > .field-label {
  margin: 0 2px;
}

.meeting-partners-card {
  display: grid;
  gap: var(--space-3);
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #f8fbf9;
}

.meeting-partners-card .grouped-person-picker {
  margin: 0;
}

.meeting-booked-confirmation > p {
  margin: 0;
  color: var(--muted);
  font-weight: 700;
}

.multi-share-settings-section {
  border-color: #d8cff0;
  background: #fbf9ff;
}

.multi-share-icon {
  color: var(--event);
  background: #eee8fb;
}

/* v38: prova-på-produkter och testprocess */
.trial-products-editor,
.health-test-card,
.test-activity-context,
.test-meeting-time,
.test-date-input,
.test-decision-choice,
.zino-destination-choice {
  min-width: 0;
}

.section-help {
  margin: 0 0 14px;
  color: var(--muted, #68756f);
  line-height: 1.45;
}

.trial-product-list .product-row strong {
  min-width: 0;
  overflow-wrap: anywhere;
}

.health-test-matrix {
  display: grid;
  gap: 12px;
  width: 100%;
  min-width: 0;
}

.health-test-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
  padding: 13px;
  border: 1px solid #dce7e2;
  border-radius: 16px;
  background: #f8fbf9;
}

.health-test-row.inactive-test,
.test-catalog-list .inactive-test {
  opacity: 0.68;
  background: #f1f3f2;
}

.health-test-name,
.test-next-action {
  grid-column: 1 / -1;
}

.health-test-name {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.health-test-name > span,
.test-activity-context > span,
.test-icon,
.test-bg {
  color: #176e5c;
  background: #dff3ec;
}

.health-test-name > span,
.test-activity-context > span {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border-radius: 11px;
}

.health-test-name strong {
  min-width: 0;
  overflow-wrap: anywhere;
}

.health-test-name small {
  margin-left: auto;
  color: #747d79;
}

.test-date-cell {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.test-date-cell > span {
  color: #6c7873;
  font-size: var(--text-label);
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.test-date-actions {
  display: flex;
  gap: 6px;
  min-width: 0;
}

.test-date-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-width: 0;
  min-height: 40px;
  padding: 8px 9px;
  border: 1px solid #cadbd4;
  border-radius: 11px;
  color: #176e5c;
  background: #fff;
  font-size: var(--text-secondary);
  font-weight: 800;
}

.test-date-actions button:first-child {
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
}

.test-date-actions .has-date {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.test-date-actions .test-date-delete {
  flex: 0 0 40px;
  color: #c64242;
  border-color: #f0d1d1;
  background: #fff6f6;
}

.test-date-actions button:disabled {
  color: #a8b0ad;
  background: #f0f2f1;
}

.test-next-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  min-width: 0;
  padding: 11px 12px;
  border: 0;
  border-radius: 12px;
  color: #125c4e;
  text-align: left;
  background: #dff3ec;
}

.test-next-action span {
  display: grid;
  min-width: 0;
}

.test-next-action small {
  font-size: var(--text-micro);
  letter-spacing: .1em;
}

.test-next-action strong {
  overflow-wrap: anywhere;
}

.test-activity-context {
  display: flex;
  gap: 11px;
  padding: 13px;
  border-radius: 15px;
  background: #eef8f4;
}

.test-activity-context > div {
  display: grid;
  min-width: 0;
}

.test-activity-context small,
.test-activity-context p {
  color: #65736d;
}

.test-activity-context strong {
  overflow-wrap: anywhere;
}

.test-activity-context p {
  margin: 3px 0 0;
  font-size: var(--text-secondary);
}

.test-meeting-time,
.test-date-input,
.test-decision-choice,
.zino-destination-choice {
  display: grid;
  gap: 9px;
  padding: 14px;
  border: 1px solid #dce7e2;
  border-radius: 15px;
  background: #f8fbf9;
}

.test-booking-suggestion {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  min-width: 0;
  padding: var(--space-4);
  border: 1px solid #d8e8e1;
  border-radius: var(--radius-lg);
  background: #f3faf7;
}

.test-booking-suggestion > span {
  display: grid;
  place-items: center;
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  border-radius: var(--radius-md);
  color: var(--green);
  background: #dff3ec;
}

.test-booking-suggestion > div {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
}

.test-booking-suggestion small {
  color: var(--green);
  font-size: var(--text-micro);
  font-weight: var(--weight-label);
  letter-spacing: .08em;
}

.test-booking-suggestion strong,
.test-booking-suggestion p {
  overflow-wrap: anywhere;
}

.test-booking-suggestion p {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.45;
}

.test-decision-choice button,
.zino-choice {
  min-height: 48px;
  padding: 11px 13px;
  border: 1px solid #cfdad5;
  border-radius: 13px;
  color: #26332e;
  background: #fff;
  font-weight: 800;
  text-align: left;
}

.test-decision-choice button.active.positive,
.zino-choice.yes.active {
  color: #fff;
  border-color: #16825f;
  background: #16825f;
}

.test-decision-choice button.active.neutral,
.zino-choice.no.active {
  color: #fff;
  border-color: #c8772e;
  background: #c8772e;
}

.zino-choice {
  display: flex;
  align-items: center;
  gap: 9px;
}

.test-catalog-list input {
  width: 100%;
  min-width: 0;
  padding: 7px 9px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  font-weight: 800;
}

.test-catalog-list input:focus {
  border-color: #83b5a6;
  background: #fff;
}

.test-editor-steps .editor-fields,
.test-process-editor textarea {
  min-width: 0;
}

.test-process-editor textarea {
  min-height: 100px;
}

@media (max-width: 360px) {
  .health-test-row {
    grid-template-columns: minmax(0, 1fr);
  }
  .health-test-name,
  .test-next-action {
    grid-column: 1;
  }
}

/* Liza-avatar och rådytor för Liza Offline */
.app-canvas.has-liza-fab {
  padding-bottom: calc(156px + env(safe-area-inset-bottom));
}

.liza-avatar {
  display: block;
  width: auto;
  max-width: none;
  object-fit: contain;
  object-position: center bottom;
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
  filter: drop-shadow(0 3px 5px rgba(20, 50, 40, .16));
}

.liza-avatar-frame {
  position: relative;
  overflow: visible;
  background: transparent !important;
  box-shadow: none !important;
}

.liza-avatar-frame .liza-avatar {
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
}

.liza-settings-avatar {
  height: 57px;
}

.liza-result-avatar {
  height: 66px;
}

.liza-floating-button {
  position: fixed;
  z-index: 39;
  right: max(16px, env(safe-area-inset-right));
  left: auto;
  bottom: calc(86px + env(safe-area-inset-bottom));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: min(52vw, 220px);
  min-width: 184px;
  max-width: calc(100% - 32px);
  min-height: 52px;
  padding: 0 18px 0 70px;
  overflow: visible;
  border: 0;
  border-radius: var(--radius-lg);
  color: #fff;
  background: var(--green);
  box-shadow: 0 10px 28px rgba(15, 77, 63, 0.3);
  font-size: var(--text-body);
  font-weight: var(--weight-heading);
}

.liza-floating-avatar {
  position: absolute;
  left: 10px;
  bottom: 0;
  height: 70px;
}

.liza-floating-button > span {
  white-space: nowrap;
}

.liza-floating-button:focus-visible,
.liza-reference-row:focus-visible,
.liza-reference-activity:focus-visible,
.liza-reference-meeting:focus-visible {
  outline: 3px solid rgba(23, 111, 88, 0.28);
  outline-offset: 2px;
}

.liza-settings-section {
  border-color: #cfe4da;
  background: #f8fcfa;
}

.liza-settings-section.is-active {
  border-color: #8fc5b4;
  background: #f1faf6;
}

.liza-icon {
  color: var(--green);
  background: #e0f2e9;
}

.liza-icon.liza-avatar-frame {
  background: transparent;
}

.liza-active-status {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: 10px 12px;
  border-radius: var(--radius-md);
  color: var(--green-dark) !important;
  background: #dff3e9;
  font-weight: var(--weight-strong);
}

.liza-result-view,
.liza-result-view > * {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.liza-result-hero {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-4);
  border-radius: var(--radius-lg);
  background: #edf8f3;
}

.liza-result-hero > span {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 48px;
  height: 48px;
  border-radius: var(--radius-md);
  color: #fff;
  background: var(--green);
}

.liza-result-hero > .liza-avatar-frame {
  background: transparent;
}

.liza-result-hero > div {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
}

.liza-result-hero small {
  color: var(--green);
  font-size: var(--text-label);
  font-weight: var(--weight-label);
  letter-spacing: 0.12em;
}

.liza-result-hero h3 {
  margin: 0;
  overflow-wrap: anywhere;
}

.liza-result-intro,
.liza-result-closing {
  margin: 0;
  color: var(--ink);
  line-height: 1.58;
}

.liza-recommendations,
.liza-reference-list {
  display: grid;
  gap: var(--space-3);
  min-width: 0;
}

.liza-recommendation {
  display: grid;
  gap: var(--space-3);
  min-width: 0;
  padding: var(--space-4);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.liza-recommendation-heading {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: center;
  gap: var(--space-2);
}

.liza-recommendation-heading > span {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  color: #fff;
  background: var(--green);
  font-size: var(--text-secondary);
  font-weight: var(--weight-heading);
}

.liza-recommendation-heading h3,
.liza-recommendation > p {
  margin: 0;
  overflow-wrap: anywhere;
}

.liza-recommendation-heading h3 {
  font-size: var(--text-section-title);
}

.liza-recommendation > p {
  color: #4f5c55;
  line-height: 1.55;
}

.liza-reference-row,
.liza-reference-activity,
.liza-reference-meeting {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  cursor: pointer;
}

.liza-reference-row {
  grid-template-columns: auto minmax(0, 1fr) auto;
  text-align: left;
}

.liza-reference-row > span,
.liza-reference-meeting > div,
.liza-reference-activity > span {
  min-width: 0;
}

.liza-reference-activity {
  display: grid;
  grid-template-columns: 5px minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-3);
  padding: 13px 12px 13px 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  color: var(--ink);
  background: #fff;
  text-align: left;
}

.liza-reference-accent {
  align-self: stretch;
  background: var(--activity-color, var(--event));
}

.liza-reference-activity > span,
.liza-reference-meeting > div {
  display: grid;
  gap: var(--space-1);
}

.liza-reference-activity small,
.liza-reference-meeting small {
  color: var(--muted);
  font-size: var(--text-label);
  font-weight: var(--weight-label);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.liza-reference-activity strong,
.liza-reference-meeting strong {
  overflow-wrap: anywhere;
}

.liza-reference-activity em,
.liza-reference-meeting em {
  color: var(--muted);
  font-size: var(--text-secondary);
  font-style: normal;
}

.liza-reference-meeting {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3);
  border: 1px solid #cfe2da;
  border-radius: var(--radius-md);
  color: var(--ink);
  background: #f7fbf9;
  text-align: left;
}

.liza-reference-meeting > span {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: var(--radius-md);
  color: var(--green);
  background: #e0f2e9;
}

.liza-reference-list .event-card {
  margin: 0;
}

@media (max-width: 365px) {
  .liza-floating-button {
    right: max(12px, env(safe-area-inset-right));
    width: 188px;
    min-width: 0;
    max-width: calc(100% - 24px);
  }

  .liza-recommendation {
    padding: var(--space-3);
  }
}

/* v51: gemensam informationsarkitektur för alla aktivitetsdetaljer */
.activity-detail-layout {
  display: grid;
  gap: var(--activity-detail-gap);
  width: 100%;
  min-width: 0;
}

.activity-detail-layout > *,
.activity-detail-section,
.activity-object-stack,
.activity-object-card,
.activity-object-copy,
.activity-detail-controls,
.linked-object-people {
  min-width: 0;
  max-width: 100%;
}

.activity-detail-helper {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.55;
}

.activity-timing {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-height: 44px;
  padding: 10px var(--space-3);
  border: 1px solid #dbe6e1;
  border-radius: var(--radius-md);
  color: var(--green-dark);
  background: #f2f8f5;
  font-size: var(--text-body);
  font-weight: var(--weight-strong);
  font-variant-numeric: tabular-nums;
}

.activity-timing.is-overdue {
  border-color: #efc8ca;
  color: #a8323c;
  background: #fff4f5;
}

.activity-timing-icon {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  border-radius: var(--radius-sm);
  color: currentColor;
  background: rgba(255, 255, 255, .72);
}

.activity-detail-section,
.linked-object-people {
  display: grid;
  gap: var(--space-2);
  margin: 0;
}

.activity-detail-section-label,
.linked-object-people > .field-label {
  margin: 0 2px !important;
  color: #69766f !important;
  font-size: var(--text-label) !important;
  font-weight: var(--weight-label) !important;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.activity-object-stack {
  display: grid;
  gap: var(--space-2);
  width: 100%;
}

.activity-object-card {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-3);
  width: 100%;
  min-height: 74px;
  overflow: hidden;
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  color: var(--ink);
  background: var(--surface);
  box-shadow: 0 3px 12px rgba(31, 46, 39, .035);
  text-align: left;
  appearance: none;
}

button.activity-object-card {
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, transform .12s ease;
}

button.activity-object-card:hover {
  border-color: #b9cbc3;
  background: #fbfdfc;
}

button.activity-object-card:active {
  transform: translateY(1px);
  background: #f3f8f5;
}

button.activity-object-card:focus-visible,
.selectable-person-open:focus-visible,
.selectable-person-check:focus-visible {
  outline: 3px solid rgba(39, 121, 216, .34);
  outline-offset: 2px;
}

.activity-object-icon,
.activity-object-card > .avatar {
  grid-column: 1;
  grid-row: 1;
  justify-self: center;
}

.activity-object-icon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: var(--radius-md);
  color: var(--green);
  background: var(--cash-soft);
}

.activity-object-card.event .activity-object-icon {
  color: var(--event);
  background: var(--event-soft);
}

.activity-object-card.campaign .activity-object-icon {
  color: #a86411;
  background: #fff3dc;
}

.activity-object-card.meeting .activity-object-icon {
  color: #a65a1d;
  background: #f9e5cf;
}

.activity-object-card.test .activity-object-icon {
  color: #24739f;
  background: #e8f4fb;
}

.activity-object-copy {
  grid-column: 2;
  display: grid;
  gap: 3px;
  overflow: hidden;
}

.activity-object-copy small {
  color: var(--muted);
  font-size: var(--text-micro);
  font-weight: var(--weight-label);
  letter-spacing: .09em;
  text-transform: uppercase;
}

.activity-object-copy strong,
.activity-object-copy > span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.activity-object-copy strong {
  color: var(--ink);
  font-size: var(--text-card-title);
  line-height: 1.22;
}

.activity-object-copy > span:not(.picker-person-tags) {
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.35;
}

.activity-object-card > svg {
  grid-column: 3;
  color: #76827c;
}

.activity-object-card.person.is-inactive {
  border-color: #d8ddda;
  color: #707a75;
  background: #f2f4f3;
  box-shadow: none;
}

/* Äldre mötesklasser kan finnas kvar för kompatibla tester, men kortet följer
   alltid den gemensamma v51-grammatiken när det är ett ActivityObjectCard. */
.activity-object-card.scheduled-meeting-card {
  display: grid;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3);
  border-color: var(--line);
  background: var(--surface);
}

.activity-object-card.scheduled-meeting-card > span {
  width: 44px;
  height: 44px;
  color: #a65a1d;
  background: #f9e5cf;
}

.activity-object-card.scheduled-meeting-card strong {
  font-size: var(--text-card-title);
}

.activity-detail-instructions .activity-instructions {
  margin: 0;
}

.activity-detail-controls {
  display: grid;
  gap: var(--space-3);
  width: 100%;
}

.meeting-action-sheet > .activity-detail-layout,
.meeting-booking-sheet > .activity-detail-layout {
  margin: 0;
}

.meeting-partners-card {
  padding: var(--space-3);
  border-radius: var(--radius-lg);
}

.selectable-person-object {
  grid-template-columns: minmax(0, 1fr) 48px;
  gap: var(--space-2);
  padding: 0;
}

.selectable-person-open {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: var(--space-2);
  min-width: 0;
  min-height: 68px;
  padding: 9px 4px 9px 10px;
  border: 0;
  color: inherit;
  background: transparent;
  text-align: left;
}

.selectable-person-check {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  justify-self: center;
  border: 2px solid #cbd7d1;
  border-radius: 50%;
  color: #fff;
  background: #fff;
}

.selectable-person-object.selected .selectable-person-check {
  border-color: var(--green);
  background: var(--green);
}

.selectable-person-check:disabled {
  opacity: .65;
  cursor: not-allowed;
}

.linked-object-people {
  gap: var(--space-2);
}

@media (max-width: 380px) {
  .activity-object-card {
    grid-template-columns: 42px minmax(0, 1fr) auto;
    gap: var(--space-2);
    padding: 10px;
  }

  .activity-object-icon {
    width: 40px;
    height: 40px;
  }

  .activity-object-copy strong {
    font-size: var(--text-body);
  }
}

/* v52: en kanonisk personrad i listor, personval och objektkopplingar. */
.canonical-person-list,
.people-list,
.person-picker-list,
.meeting-partner-rows {
  display: grid;
  gap: 0;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}

.canonical-person-row {
  --person-color: var(--lead);
  --person-selected-bg: #f4effc;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto auto;
  align-items: stretch;
  gap: 0;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 76px;
  overflow: hidden;
  padding: 0;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  color: var(--ink);
  background: transparent;
  text-align: left;
  transition: background .16s ease;
}

.canonical-person-row.person-tone-customer {
  --person-color: var(--customer);
  --person-selected-bg: #eef6ff;
}

.canonical-person-row.person-tone-partner {
  --person-color: var(--partner);
  --person-selected-bg: #edf8f2;
}

.canonical-person-row.person-tone-outer-partner {
  --person-color: var(--outer);
  --person-selected-bg: #fff4e9;
}

.canonical-person-row.person-tone-upline-partner {
  --person-color: #b78712;
  --person-selected-bg: #fff9df;
}

.canonical-person-row.person-tone-missing {
  --person-color: #727a75;
  --person-selected-bg: #f1f3f2;
}

.canonical-person-row.selectable-person-object {
  grid-template-columns: minmax(0, 1fr) auto auto 42px 42px;
}

.canonical-person-row.selected {
  border-color: var(--line);
  background: var(--person-selected-bg);
}

.canonical-person-row .person-row-main {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: var(--space-2);
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 75px;
  overflow: hidden;
  padding: 10px 6px 10px 4px;
  border: 0;
  color: inherit;
  background: transparent;
  text-align: left;
}

.canonical-person-row button.person-row-main:not(:disabled) {
  cursor: pointer;
}

.canonical-person-row button.person-row-main:disabled {
  opacity: 1;
  cursor: default;
}

.person-row-copy {
  display: grid;
  gap: 3px;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}

.person-row-name {
  display: block;
  min-width: 0;
  overflow: hidden;
  color: var(--ink);
  font-size: var(--text-body);
  font-weight: 740;
  line-height: 1.25;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.person-row-meta {
  display: block;
  min-width: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.35;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.person-row-progress {
  display: block;
  width: 100%;
  margin-top: 3px;
}

.person-row-tags {
  display: flex;
  flex-wrap: nowrap;
  gap: var(--space-1);
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  margin-top: 3px;
  padding-bottom: 1px;
  scrollbar-width: none;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
}

.person-row-tags::-webkit-scrollbar {
  display: none;
}

.person-row-tags i {
  flex: 0 0 auto;
  max-width: min(68vw, 235px);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.person-row-tags i.tag-tone-inner,
.person-row-tags i.tag-tone-side {
  color: var(--partner);
  background: var(--partner-soft);
}

.person-row-tags i.tag-tone-outer {
  color: #ad5b1e;
  background: var(--outer-soft);
}

.person-row-tags i.tag-tone-upline {
  color: #9a7310;
  background: #fff3bf;
}

.person-row-tags i.tag-tone-customer {
  color: #1769a8;
  background: var(--customer-soft);
}

.person-row-tags i.tag-tone-partner {
  color: #176846;
  background: var(--partner-soft);
}

.person-row-tags i.tag-tone-undecided {
  color: #6d4d99;
  background: #f2ecfb;
}

.person-row-tags i.tag-tone-product {
  color: var(--muted);
  background: #f1f3f2;
}

.person-row-metadata {
  align-self: center;
  display: inline-flex;
  gap: 4px;
  padding-inline: 4px;
}

.person-row-metadata-icon,
.person-row-status-action {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 50%;
  color: var(--muted);
  background: #f1f3f2;
}

.person-row-metadata-icon.new {
  color: #a46700;
  background: #fff3bf;
}

.person-row-metadata-icon.history {
  color: var(--green);
  background: color-mix(in srgb, var(--green) 9%, var(--surface));
}

.person-row-status-action {
  align-self: center;
  cursor: pointer;
}

.person-row-status-action.negative {
  color: var(--danger);
  background: color-mix(in srgb, var(--danger) 8%, var(--surface));
}

.person-row-status-action.positive {
  color: var(--green);
  background: color-mix(in srgb, var(--green) 8%, var(--surface));
}

.person-row-check,
.person-row-chevron {
  align-self: center;
  justify-self: center;
  flex: 0 0 auto;
}

.person-row-check {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border: 2px solid #cbd4cf;
  border-radius: 9px;
  color: #fff;
  background: #fff;
}

.canonical-person-row.selected .person-row-check {
  border-color: var(--person-color);
  background: var(--person-color);
}

.person-row-check:disabled {
  opacity: 1;
  cursor: default;
}

.person-row-chevron {
  display: grid;
  place-items: center;
  width: 38px;
  height: 42px;
  border: 0;
  color: #8a948e;
  background: transparent;
}

button.person-row-chevron {
  cursor: pointer;
}

.canonical-person-row.is-inactive .person-row-copy {
  opacity: .66;
}

.canonical-person-row.is-missing .avatar {
  color: #69716c;
  background: #dfe3e1;
}

.canonical-person-row.team-person {
  min-height: 76px;
  border-left: 0;
  border-radius: 0;
  background: transparent;
}

/* v64.8: v64.6:s Planning-Event är ensam canonical EventRow. */
.canonical-event-row {
  --event-color: var(--event);
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-3);
  width: 100%;
  min-width: 0;
  min-height: 96px;
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-left: 4px solid var(--event-color);
  border-radius: var(--radius-lg);
  color: var(--ink);
  background: #fff;
  text-align: left;
  box-shadow: 0 4px 13px #1f2e2709;
}

button.canonical-event-row { cursor: pointer; }

.canonical-event-row .event-date-box {
  display: grid;
  place-items: center;
  align-content: center;
  width: 50px;
  height: 60px;
  border-radius: var(--radius-md);
  background: var(--soft);
}

.canonical-event-row .event-date-box strong {
  font-size: var(--text-section-title);
  line-height: 1;
}

.canonical-event-row .event-date-box span {
  margin-top: 4px;
  color: var(--muted);
  font-size: var(--text-label);
  text-transform: uppercase;
}

.canonical-event-row .event-copy {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
}

.canonical-event-row .event-copy > span {
  color: var(--event-color);
  font-size: var(--text-label);
  font-weight: 760;
}

.canonical-event-row .event-copy strong,
.canonical-event-row .event-copy small {
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.canonical-event-row .event-copy strong { font-size: var(--text-body); }
.canonical-event-row .event-copy small {
  color: var(--muted);
  font-size: var(--text-secondary);
}

.canonical-event-row > svg { color: #99a39d; }

.activity-parent-event.canonical-event-row {
  margin: 0;
  border-color: color-mix(in srgb, var(--event-color) 28%, var(--line));
  border-left-color: var(--event-color);
  box-shadow: 0 8px 22px #163c3020;
}

/* v54: möten delar planeringsradens visuella grammatik i hela appen. */
.canonical-meeting-row {
  --meeting-color: #c87327;
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-3);
  width: 100%;
  min-width: 0;
  min-height: 96px;
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-left: 4px solid var(--meeting-color);
  border-radius: var(--radius-lg);
  color: var(--ink);
  background: #fff;
  text-align: left;
  box-shadow: 0 4px 13px #1f2e2709;
}

button.canonical-meeting-row { cursor: pointer; }

.meeting-row-date-box {
  display: grid;
  place-items: center;
  align-content: center;
  width: 50px;
  height: 60px;
  border-radius: var(--radius-md);
  background: #fff0df;
}

.meeting-row-date-box strong {
  font-size: var(--text-section-title);
  line-height: 1;
}

.meeting-row-date-box span {
  margin-top: 4px;
  color: var(--muted);
  font-size: var(--text-label);
  text-transform: uppercase;
}

.meeting-row-copy {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
}

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

.meeting-row-copy strong {
  font-size: var(--text-body);
  font-weight: 740;
  line-height: 1.3;
}

.meeting-row-copy small {
  color: var(--muted);
  font-size: var(--text-secondary);
}

.meeting-row-eyebrow {
  overflow: hidden;
  color: var(--meeting-color);
  font-size: var(--text-label);
  font-weight: 780;
  line-height: 1.2;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.meeting-row-eyebrow.success { color: #126549; }
.meeting-row-eyebrow.danger { color: #a43f45; }
.meeting-row-eyebrow.muted { color: #66706a; }
.meeting-row-eyebrow.warning { color: #916414; }

.meeting-detail-card { min-width: 0; }

.meeting-card-instruction {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-secondary);
  line-height: 1.5;
}

.meeting-action-group {
  display: grid;
  gap: var(--space-3);
  min-width: 0;
  padding: var(--space-1) 0;
}

.meeting-action-group h3 {
  margin: 0;
  font-size: var(--text-section-title);
  line-height: 1.25;
}

.commitment-resolution-list {
  display: grid;
  gap: var(--space-4);
}

.commitment-resolution-item {
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface, #fff);
}

.commitment-object-choices button {
  min-height: 46px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #fff;
  font-weight: 760;
}

.commitment-object-choices .danger-choice.active {
  border-color: #b84a4f;
  background: #fff0f0;
  color: #9e343a;
}

.commitment-object-choices .keep-choice.active {
  border-color: var(--green);
  background: #edf8f2;
  color: #176846;
}

.meeting-action-positive {
  background: var(--green);
  color: #fff;
}

.meeting-derived-state {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3);
  border-radius: var(--radius-md);
  color: #76541f;
  background: #fff6df;
}

.meeting-decision-actions {
  display: grid;
  gap: var(--space-2);
}

.meeting-participation-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-2);
  width: 100%;
}

.meeting-participation-actions button {
  min-height: 48px;
  padding: var(--space-2);
}

.continuation-candidate.recommended {
  border-color: var(--green);
  background: #edf8f2;
  color: #176846;
}

.continuation-candidate.allowed {
  border-color: #df9a53;
  background: #fff6eb;
  color: #9a561d;
}

.meeting-action-change,
.meeting-action-negative {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-height: 54px;
  padding: 0 16px;
  border: 0;
  border-radius: var(--radius-md);
  color: #fff;
  font-size: var(--text-body);
  font-weight: 750;
}

.meeting-action-change { background: #c87327; }
.meeting-action-negative { background: #b74750; }

.meeting-empty-participants {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-secondary);
}

.event-card.is-passed,
.canonical-event-row.is-passed {
  border-left-color: #9a6a23;
  background: #fffdf8;
}

.event-card.is-passed .event-copy > span,
.canonical-event-row.is-passed .event-copy > span {
  color: #8a5c19;
}

.event-card.is-cancelled,
.event-card.is-archived,
.canonical-event-row.is-cancelled,
.canonical-event-row.is-archived {
  opacity: 0.76;
}

.event-lifecycle-badge {
  display: inline-flex;
  width: fit-content;
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  background: rgba(255, 255, 255, 0.88);
  color: var(--ink);
  font-size: var(--text-label);
  font-weight: var(--weight-label);
  letter-spacing: 0.08em;
}

.event-repair-button {
  border-style: dashed;
}

.passed-heading .eyebrow { color: #8a5c19; }

.rhythm-goal-panel {
  margin: 0;
}

.meeting-derived-state.success { color: #126549; background: #e7f7ef; }
.meeting-derived-state.danger { color: #a43f45; background: #fff0f1; }
.meeting-derived-state.muted { color: #66706a; background: #eef1ef; }
.meeting-derived-state div { display: grid; gap: 2px; }
.meeting-derived-state small { font-size: var(--text-micro); font-weight: 800; letter-spacing: .06em; }

.meeting-milestone-notice {
  margin: 0;
  padding: 12px 14px;
  border-radius: 14px;
  background: #eef6f3;
  color: #315f55;
  font-size: .88rem;
  line-height: 1.45;
}

.meeting-management-card,
.meeting-next-step-card { min-width: 0; }

.meeting-participants-block {
  display: grid;
  gap: var(--space-2);
}

.meeting-partner-selection-trigger {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  width: 100%;
  min-height: 50px;
  padding: 10px 14px;
  border: 1px dashed #9eb8ae;
  border-radius: var(--radius-md);
  color: var(--green);
  background: #f7fbf9;
  font-weight: 760;
}

.meeting-partner-selection-trigger.has-partners {
  margin-top: var(--space-1);
  border-color: var(--line);
  background: #fff;
}

.meeting-partner-selection-trigger.is-empty {
  min-height: 72px;
}

.planning-meeting-row {
  --meeting-color: #c87327;
}

.meeting-activity-hint {
  margin: 0;
  padding: var(--space-3);
  border-radius: var(--radius-md);
  color: var(--muted);
  background: var(--surface-muted);
  font-size: var(--text-secondary);
  line-height: 1.45;
}

.test-milestone-summary {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
  width: 100%;
}

.test-milestone-summary span {
  padding: 5px 4px;
  border-radius: var(--radius-sm);
  color: #7b837e;
  background: #eef1ef;
  font-size: var(--text-micro);
  text-align: center;
}

.test-milestone-summary span.done { color: #126549; background: #e5f6ee; }
.test-milestone-summary span.declined { color: #76541f; background: #fff3d9; }

.test-order-start {
  width: fit-content;
  min-height: 34px;
  margin-top: 4px;
  padding: 6px 10px;
  border: 1px solid #e4bc91;
  border-radius: var(--radius-sm);
  color: #9b551b;
  background: #fff8ef;
  font-size: var(--text-label);
  font-weight: 740;
}

.test-linked-meetings {
  grid-column: 1 / -1;
  display: grid;
  min-width: 0;
  border-top: 1px solid var(--line);
}

.team-side-branch .canonical-person-row.team-person {
  min-height: 72px;
  border-left-color: var(--root-leg-color, var(--person-color));
}

.team-side-branch .canonical-person-row .avatar {
  width: 45px;
  height: 45px;
  font-size: var(--text-secondary);
}

.profile-hero > .avatar + .person-row-copy,
.profile-hero > .person-row-copy {
  flex: 1 1 0%;
  width: 0;
  min-width: 0;
  max-width: 100%;
}

.profile-hero .profile-person-identity .person-row-name {
  font-size: var(--text-section-title);
  letter-spacing: -.025em;
}

.profile-hero .profile-person-identity .person-row-tags {
  margin-top: 5px;
}

.activity-person-list,
.meeting-confirmation-person,
.meeting-partner-rows {
  border-top: 1px solid var(--line);
}

.activity-person-list .canonical-person-row:last-child,
.meeting-confirmation-person .canonical-person-row:last-child,
.meeting-partner-rows .canonical-person-row:last-child,
.people-list .canonical-person-row:last-child,
.person-picker-group .canonical-person-row:last-child {
  border-bottom-color: transparent;
}

.person-picker-group {
  gap: 0;
}

.person-picker-group + .person-picker-group {
  margin-top: var(--space-3);
}

.canonical-person-row .selectable-person-toggle {
  min-height: 75px;
  padding-left: 4px;
}

.canonical-person-row .selectable-person-open {
  display: grid;
  min-width: 0;
  min-height: 42px;
  padding: 0;
}

.canonical-person-row .selectable-person-check {
  width: 30px;
  height: 30px;
  justify-self: center;
  border-radius: 9px;
}

.canonical-person-row.selected .selectable-person-check {
  border-color: var(--person-color);
  background: var(--person-color);
}

.canonical-person-row .person-row-main:focus-visible,
.canonical-person-row .person-row-check:focus-visible,
.canonical-person-row .person-row-chevron:focus-visible {
  position: relative;
  z-index: 1;
  outline: 3px solid rgba(39, 121, 216, .34);
  outline-offset: -2px;
}

@media (max-width: 370px) {
  .canonical-person-row.selectable-person-object {
    grid-template-columns: minmax(0, 1fr) 38px 36px;
  }

  .canonical-person-row .person-row-main {
    padding-right: 3px;
  }
}

.liza-floating-button {
  justify-content: flex-start;
  padding-left: 82px;
}

.liza-floating-avatar {
  left: 20px;
}

.test-process-system-flow {
  display: grid;
  gap: 7px;
  padding: 11px 12px;
  border: 1px solid #d9e6e0;
  border-radius: 12px;
  background: #f7faf8;
}

.test-process-system-flow > small {
  color: #66736e;
  font-size: var(--text-label);
  font-weight: 800;
  letter-spacing: .08em;
}

.test-process-system-flow > div {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.test-process-system-flow span {
  padding: 6px 8px;
  border-radius: 999px;
  color: #145f50;
  background: #e3f2ec;
  font-size: var(--text-label);
  font-weight: 760;
}

.test-process-system-flow svg {
  flex: 0 0 auto;
  color: #8a9892;
}

.event-process-menu-list {
  display: grid;
  gap: var(--space-2);
}

.campaign-template-menu-list {
  display: grid;
  gap: var(--space-2);
}

.event-process-menu-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 13px;
  color: var(--event);
  background: #eee9fb;
}

.campaign-template-menu-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 13px;
  color: #b46c0c;
  background: #fff3d9;
}

.lead-funnel-statistics {
  display: grid;
  gap: var(--space-3);
  margin-top: 26px;
  padding: 22px 0 10px;
  border-top: 1px solid var(--line);
}

.lead-funnel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}

.lead-funnel-heading h2 {
  margin: 2px 0 0;
  font-size: var(--text-section-title);
}

.lead-funnel-heading > svg {
  color: var(--lead);
}

.lead-funnel-summary {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-secondary);
}

.lead-funnel {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 14px 12px;
  border: 1px solid #ddd9ea;
  border-radius: var(--radius-lg);
  background: linear-gradient(145deg, #fbfafd, #f6faf8);
  box-shadow: 0 5px 16px rgba(40, 37, 63, .05);
}

.lead-funnel-row {
  display: grid;
  grid-template-columns: minmax(108px, 42%) minmax(0, 58%);
  align-items: center;
  min-width: 0;
}

.lead-funnel-shape-cell {
  display: flex;
  justify-content: center;
  min-width: 0;
}

.lead-funnel-segment {
  display: grid;
  place-items: center;
  min-width: 30px;
  min-height: 51px;
  padding: 5px;
  clip-path: polygon(3% 0, 97% 0, 87% 100%, 13% 100%);
  color: #fff;
  filter: saturate(.92);
  transition: width .2s ease;
}

.lead-funnel-segment strong {
  font-size: var(--text-body);
  text-shadow: 0 1px 2px rgba(0, 0, 0, .22);
}

.lead-funnel-label {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding-left: 12px;
}

.lead-funnel-label strong {
  overflow-wrap: anywhere;
  color: var(--ink);
  font-size: var(--text-secondary);
  line-height: 1.2;
}

.lead-funnel-label small {
  color: var(--muted);
  font-size: var(--text-label);
}

@media (max-width: 365px) {
  .lead-funnel {
    padding-inline: 8px;
  }

  .lead-funnel-row {
    grid-template-columns: minmax(96px, 39%) minmax(0, 61%);
  }

  .lead-funnel-label {
    padding-left: 9px;
  }
}
.attendance-person-row {
  align-items: center;
  border-radius: var(--radius-md);
  display: flex;
  gap: var(--space-2);
  padding: var(--space-1);
}

.attendance-person-row > .canonical-person-row {
  flex: 1;
}

.attendance-person-row.attendance-present,
.attendance-person-row.attendance-absent {
  background: transparent;
}

.attendance-actions {
  display: flex;
  gap: var(--space-1);
}

.attendance-actions button {
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  display: inline-flex;
  justify-content: center;
  min-block-size: 40px;
  min-inline-size: 40px;
}

.attendance-actions .present.active {
  background: var(--green);
  color: #fff;
}

.attendance-actions .absent.active {
  background: var(--danger);
  color: #fff;
}
.person-picker-group.is-recommended {
  border-color: var(--green);
  background: color-mix(in srgb, var(--green) 8%, transparent);
}

.person-picker-group.is-recommended .person-picker-group-title {
  color: var(--green);
}

.event-expected-group {
  display: grid;
  gap: 2px;
  padding: 2px;
  border: 2px dashed var(--green);
  border-radius: 0;
  background: transparent;
}

.person-picker-group.event-expected-group.is-recommended {
  background: transparent;
}

.event-other-people,
.additional-person-content {
  display: grid;
  gap: var(--space-2);
}

.additional-person-search {
  min-height: 44px;
  padding: 0 var(--space-3);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface);
  color: var(--ink);
}

.next-action-groups,
.next-action-group,
.next-action-button-grid {
  display: grid;
  gap: var(--space-2);
}

.next-action-groups {
  gap: var(--space-4);
}

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

.next-action-button-grid button {
  min-height: 48px;
}

.next-action-choice {
  display: grid;
  gap: var(--space-1);
}

.existing-commitment-group,
.next-action-choice.event-target {
  padding: var(--space-2);
  border: 1px solid color-mix(in srgb, var(--green) 45%, var(--line));
  border-radius: var(--radius-lg);
  background: color-mix(in srgb, var(--green) 8%, var(--surface));
}

.existing-commitment-select {
  min-height: 44px;
  border: 1px solid var(--green);
  border-radius: var(--radius-md);
  color: #fff;
  background: var(--green);
  font-weight: 750;
}

.next-action-primary {
  border-color: var(--green);
  background: var(--green);
  color: #fff;
}

.next-action-secondary {
  border-color: color-mix(in srgb, var(--ink) 16%, var(--line));
  background: color-mix(in srgb, var(--ink) 5%, var(--surface));
}

.track-change-actions {
  display: grid;
  gap: var(--space-2);
}

.next-action-track {
  border-color: var(--customer);
  color: #fff;
  background: var(--customer);
}

.pipeline-forward-actions,
.pipeline-backward-actions {
  display: grid;
  gap: var(--space-2);
}

.next-action-warning {
  border-color: #c87327;
  color: #fff;
  background: #c87327;
}

.next-action-disclosed-groups {
  display: grid;
  gap: var(--space-3);
}

.track-change-actions .activity-detail-section-label,
.pipeline-forward-actions .activity-detail-section-label,
.pipeline-backward-actions .activity-detail-section-label {
  display: flex;
  align-items: center;
  gap: var(--space-1);
}

.track-change-actions .activity-detail-section-label > svg,
.pipeline-forward-actions .activity-detail-section-label > svg,
.pipeline-backward-actions .activity-detail-section-label > svg {
  color: #d6a31f;
}

.track-change-actions .next-action-choice.event-target {
  border-color: color-mix(in srgb, var(--customer) 60%, var(--line));
  background: color-mix(in srgb, var(--customer) 9%, var(--surface));
}

.next-action-terminal {
  min-height: 48px;
  border: 1px solid var(--danger);
  border-radius: var(--radius-md);
  background: var(--danger);
  color: #fff;
  font-weight: 750;
}

.pipeline-frontier-list {
  display: grid;
  gap: 10px;
}