.stakeholder-engagement-flow-sidebar {
  border-left: 1px solid rgb(244 244 245) !important;
  background: #fff !important;
  padding: 0 !important;
}

@media (min-width: 1280px) {
  .stakeholder-engagement-flow-sidebar {
    overflow: hidden !important;
  }
}

.stakeholder-engagement-flow {
  --stakeholder-flow-accent: rgb(113 113 122);
  --stakeholder-flow-accent-ring: rgba(113, 113, 122, .10);
  position: relative;
  height: 100%;
  min-height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  padding: clamp(2rem, 4.5vh, 3rem) clamp(1.8rem, 4vw, 2.75rem) 1.65rem;
  scrollbar-width: thin;
  scrollbar-color: rgb(212 212 216) transparent;
  background:
    radial-gradient(circle at 84% 14%, rgba(24,24,27,.028), transparent 27%),
    linear-gradient(180deg, #fff 0%, #fff 74%, rgb(250 250 250) 100%);
}

.stakeholder-engagement-flow::-webkit-scrollbar {
  width: 7px;
}

.stakeholder-engagement-flow::-webkit-scrollbar-track {
  background: transparent;
}

.stakeholder-engagement-flow::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgb(212 212 216);
}

.stakeholder-engagement-flow::before {
  content: attr(data-ghost);
  position: absolute;
  right: -1.1rem;
  bottom: -.8rem;
  z-index: 0;
  font-size: clamp(6.8rem, 12vw, 10rem);
  line-height: .78;
  font-weight: 800;
  letter-spacing: -.085em;
  color: rgba(24,24,27,.032);
  pointer-events: none;
  user-select: none;
}

.stakeholder-engagement-flow::after {
  content: "";
  position: absolute;
  right: 8%;
  top: 8%;
  z-index: 0;
  width: 10rem;
  height: 10rem;
  border-radius: 2.25rem;
  border: 1px solid rgba(24,24,27,.04);
  transform: rotate(16deg);
  box-shadow:
    2rem 2rem 0 -1px rgba(24,24,27,.014),
    4rem 4rem 0 -1px rgba(24,24,27,.008);
  pointer-events: none;
}

.stakeholder-engagement-flow__inner {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 27rem;
  min-height: 100%;
  margin: 0 auto;
}

.stakeholder-engagement-flow__header {
  position: relative;
}

.stakeholder-engagement-flow__eyebrow {
  margin: 0;
  font-size: .625rem;
  line-height: 1rem;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgb(113 113 122);
}

.stakeholder-engagement-flow__header h2 {
  margin: .55rem 0 0;
  max-width: 20rem;
  color: rgb(24 24 27);
  font-size: clamp(1.7rem, 2.2vw, 2.3rem);
  line-height: 1.02;
  font-weight: 650;
  letter-spacing: -.05em;
}

.stakeholder-engagement-flow__intro {
  margin: .85rem 0 0;
  max-width: 23rem;
  color: rgb(113 113 122);
  font-size: .76rem;
  line-height: 1.35rem;
}

.stakeholder-engagement-flow__status {
  position: relative;
  margin-top: 1.55rem;
  padding: .9rem 0 1rem;
  border-top: 1px solid rgb(228 228 231);
  border-bottom: 1px solid rgb(228 228 231);
}

.stakeholder-engagement-flow__status-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
}

.stakeholder-engagement-flow__status-label,
.stakeholder-engagement-flow__section-label,
.stakeholder-engagement-flow__record-kicker,
.stakeholder-engagement-flow__footer-label {
  margin: 0;
  color: rgb(161 161 170);
  font-size: .56rem;
  line-height: .9rem;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.stakeholder-engagement-flow__status-step {
  display: inline-flex;
  min-height: 1.4rem;
  align-items: center;
  border-radius: 999px;
  background: rgb(244 244 245);
  padding: .12rem .48rem;
  color: rgb(82 82 91);
  font-size: .54rem;
  line-height: .9rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: .035em;
}

.stakeholder-engagement-flow__status-copy {
  min-height: 4.55rem;
  transition:
    opacity .34s ease,
    transform .46s cubic-bezier(.22, 1, .36, 1);
  will-change: opacity, transform;
}

.stakeholder-engagement-flow__status-copy.is-changing {
  opacity: 0;
  transform: translateY(6px);
}

.stakeholder-engagement-flow__status h3 {
  min-height: 2rem;
  margin: .52rem 0 0;
  color: rgb(24 24 27);
  font-size: .88rem;
  line-height: 1.15rem;
  font-weight: 700;
  letter-spacing: -.025em;
}

.stakeholder-engagement-flow__status p {
  min-height: 1.9rem;
  margin: .4rem 0 0;
  max-width: 24rem;
  color: rgb(113 113 122);
  font-size: .65rem;
  line-height: 1.05rem;
}

.stakeholder-engagement-flow__progress {
  position: relative;
  height: 1px;
  margin-top: .72rem;
  overflow: visible;
  border-radius: 999px;
  background: rgb(228 228 231);
}

.stakeholder-engagement-flow__progress-bar {
  position: absolute;
  inset: 0 auto 0 0;
  width: 0;
  height: 1px;
  border-radius: inherit;
  background: rgb(82 82 91);
  transition: width .48s cubic-bezier(.22, 1, .36, 1);
}

.stakeholder-engagement-flow__progress-head {
  position: absolute;
  top: 50%;
  left: 0;
  width: .48rem;
  height: .48rem;
  border-radius: 999px;
  background: var(--stakeholder-flow-accent);
  box-shadow:
    0 0 0 4px #fff,
    0 0 0 7px var(--stakeholder-flow-accent-ring);
  transform: translate(-50%, -50%);
  transition: left .48s cubic-bezier(.22, 1, .36, 1);
}

.stakeholder-engagement-flow__participants {
  margin-top: 1.15rem;
}

.stakeholder-engagement-flow__section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: .75rem;
  margin-bottom: .32rem;
}

.stakeholder-engagement-flow__section-note {
  margin: 0;
  color: rgb(161 161 170);
  font-size: .54rem;
  line-height: .9rem;
  font-weight: 650;
}

.stakeholder-engagement-flow__parties {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
}

.stakeholder-engagement-flow__party {
  position: relative;
  display: grid;
  grid-template-columns: 1.6rem minmax(0, 1fr) auto;
  gap: .68rem;
  min-height: 3.25rem;
  align-items: center;
  border-radius: .72rem;
  padding: .45rem .5rem .48rem .05rem;
  color: rgb(24 24 27);
  transition:
    transform .44s cubic-bezier(.22, 1, .36, 1),
    background-color .34s ease,
    opacity .34s ease;
}

.stakeholder-engagement-flow__party::after {
  content: "";
  position: absolute;
  left: .78rem;
  top: 2rem;
  bottom: -.78rem;
  width: 1px;
  background: rgb(228 228 231);
  pointer-events: none;
}

.stakeholder-engagement-flow__party:last-child::after {
  display: none;
}

.stakeholder-engagement-flow__party.is-related {
  background: rgba(250,250,250,.70);
}

.stakeholder-engagement-flow__party.is-active {
  background: rgba(250,250,250,.96);
  transform: translateX(3px);
}

.stakeholder-engagement-flow__party-index {
  position: relative;
  z-index: 2;
  display: inline-flex;
  width: 1.38rem;
  height: 1.38rem;
  align-items: center;
  justify-content: center;
  justify-self: center;
  border: 1px solid rgb(212 212 216);
  border-radius: 999px;
  background: #fff;
  color: rgb(113 113 122);
  box-shadow: 0 0 0 4px rgba(255,255,255,.96);
  font-size: .42rem;
  line-height: 1;
  font-weight: 800;
  letter-spacing: -.01em;
  transition:
    border-color .42s ease,
    background-color .42s ease,
    color .42s ease,
    box-shadow .42s ease,
    transform .42s cubic-bezier(.18,.9,.3,1.3);
}

.stakeholder-engagement-flow__party.is-related .stakeholder-engagement-flow__party-index {
  border-color: rgb(161 161 170);
  color: rgb(63 63 70);
}

.stakeholder-engagement-flow__party.is-active .stakeholder-engagement-flow__party-index {
  border-color: var(--stakeholder-flow-accent);
  background: var(--stakeholder-flow-accent);
  color: rgb(24 24 27);
  box-shadow:
    0 0 0 4px #fff,
    0 0 0 8px var(--stakeholder-flow-accent-ring);
  transform: scale(1.08);
}

.stakeholder-engagement-flow__party.is-system .stakeholder-engagement-flow__party-index {
  border-color: rgb(63 63 70);
  background: rgb(39 39 42);
  color: #fff;
  font-size: .34rem;
  letter-spacing: .01em;
}

.stakeholder-engagement-flow__party.is-system.is-active .stakeholder-engagement-flow__party-index {
  border-color: var(--stakeholder-flow-accent);
  background: var(--stakeholder-flow-accent);
  color: rgb(24 24 27);
}

.stakeholder-engagement-flow__party-content {
  min-width: 0;
}

.stakeholder-engagement-flow__party-title-row {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: .42rem;
}

.stakeholder-engagement-flow__party-title {
  min-width: 0;
  color: rgb(39 39 42);
  font-size: .70rem;
  line-height: 1rem;
  font-weight: 700;
  letter-spacing: -.015em;
  transition: color .3s ease;
}

.stakeholder-engagement-flow__party.is-active .stakeholder-engagement-flow__party-title {
  color: rgb(9 9 11);
}

.stakeholder-engagement-flow__party-copy {
  display: block;
  margin-top: .08rem;
  max-width: 20rem;
  overflow: hidden;
  color: rgb(113 113 122);
  font-size: .54rem;
  line-height: .86rem;
  white-space: nowrap;
  text-overflow: ellipsis;
  transition: color .3s ease, opacity .3s ease;
}

.stakeholder-engagement-flow__party.is-active .stakeholder-engagement-flow__party-copy {
  color: rgb(82 82 91);
}

.stakeholder-engagement-flow__focus-dot {
  display: inline-block;
  width: .34rem;
  height: .34rem;
  flex: 0 0 auto;
  border-radius: 999px;
  background: var(--stakeholder-flow-accent);
  box-shadow: 0 0 0 3px var(--stakeholder-flow-accent-ring);
}

.stakeholder-engagement-flow__party-state {
  display: inline-flex;
  min-height: 1.25rem;
  align-items: center;
  border-radius: 999px;
  background: rgb(244 244 245);
  padding: .08rem .4rem;
  color: rgb(113 113 122);
  font-size: .46rem;
  line-height: .78rem;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
  white-space: nowrap;
  transition:
    color .3s ease,
    background-color .3s ease,
    box-shadow .3s ease;
}

.stakeholder-engagement-flow__party.is-related .stakeholder-engagement-flow__party-state {
  color: rgb(63 63 70);
  background: rgb(228 228 231);
}

.stakeholder-engagement-flow__party.is-active .stakeholder-engagement-flow__party-state {
  color: rgb(24 24 27);
  background: #fff;
  box-shadow: inset 0 0 0 1px var(--stakeholder-flow-accent);
}

.stakeholder-engagement-flow__record {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid rgb(228 228 231);
}

.stakeholder-engagement-flow__record-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .8rem;
}

.stakeholder-engagement-flow__record-id {
  margin: .16rem 0 0;
  color: rgb(24 24 27);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: .66rem;
  line-height: 1rem;
  font-weight: 750;
  letter-spacing: -.01em;
  transition:
    opacity .25s ease,
    transform .35s cubic-bezier(.22, 1, .36, 1);
}

.stakeholder-engagement-flow__record-id.is-changing {
  opacity: .25;
  transform: translateY(2px);
}

.stakeholder-engagement-flow__record-count {
  display: inline-flex;
  min-height: 1.35rem;
  align-items: center;
  border-radius: 999px;
  background: rgb(244 244 245);
  padding: .1rem .45rem;
  color: rgb(82 82 91);
  font-size: .5rem;
  line-height: .82rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.stakeholder-engagement-flow__record-list {
  display: grid;
  grid-template-rows: repeat(7, minmax(1.35rem, auto));
  min-height: 9.45rem;
  gap: 0;
  margin: .58rem 0 0;
  padding: 0;
  list-style: none;
}

.stakeholder-engagement-flow__record-item {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap: .65rem;
  min-height: 1.35rem;
  align-items: center;
  border-top: 1px solid rgb(244 244 245);
  color: rgb(113 113 122);
  font-size: .54rem;
  line-height: .86rem;
  opacity: 0;
  transform: translateY(5px);
  transition:
    opacity .34s ease,
    transform .46s cubic-bezier(.22, 1, .36, 1),
    color .3s ease,
    background-color .3s ease;
}

.stakeholder-engagement-flow__record-item.is-visible {
  color: rgb(82 82 91);
  opacity: 1;
  transform: translateY(0);
}

.stakeholder-engagement-flow__record-item.is-new {
  color: rgb(24 24 27);
  background: rgba(250,250,250,.90);
}

.stakeholder-engagement-flow__record-item.is-new::before {
  content: "";
  position: absolute;
  left: -.55rem;
  top: 50%;
  width: .24rem;
  height: .24rem;
  border-radius: 999px;
  background: var(--stakeholder-flow-accent);
  box-shadow: 0 0 0 3px var(--stakeholder-flow-accent-ring);
  transform: translateY(-50%);
}

.stakeholder-engagement-flow__record-key,
.stakeholder-engagement-flow__record-value {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.stakeholder-engagement-flow__record-key {
  color: inherit;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

.stakeholder-engagement-flow__record-value {
  text-align: right;
  color: inherit;
  font-weight: 700;
}

.stakeholder-engagement-flow__footer {
  margin-top: 1rem;
  padding-top: .85rem;
  border-top: 1px solid rgb(244 244 245);
}

.stakeholder-engagement-flow__footer-flow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .28rem .38rem;
  margin-top: .28rem;
  color: rgb(82 82 91);
  font-size: .54rem;
  line-height: .9rem;
  font-weight: 700;
}

.stakeholder-engagement-flow__footer-flow span:nth-child(even) {
  color: rgb(212 212 216);
  font-weight: 500;
}

.stakeholder-engagement-flow__footer-method {
  margin: .48rem 0 0;
  color: rgb(113 113 122);
  font-size: .54rem;
  line-height: .9rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

@media (min-width: 1280px) and (prefers-reduced-motion: no-preference) {
  .stakeholder-engagement-flow__eyebrow,
  .stakeholder-engagement-flow__header h2,
  .stakeholder-engagement-flow__intro {
    opacity: 0;
    transform: translateY(8px);
    animation: stakeholderFlowV5HeaderIn .55s cubic-bezier(.22,.8,.24,1) forwards;
  }

  .stakeholder-engagement-flow__eyebrow { animation-delay: .05s; }
  .stakeholder-engagement-flow__header h2 { animation-delay: .16s; }
  .stakeholder-engagement-flow__intro { animation-delay: .30s; }

  .stakeholder-engagement-flow__status {
    opacity: 0;
    transform: translateY(9px);
    animation: stakeholderFlowV5BlockIn .55s cubic-bezier(.22,.8,.24,1) .48s forwards;
  }

  .stakeholder-engagement-flow__section-head {
    opacity: 0;
    transform: translateY(6px);
    animation: stakeholderFlowV5BlockIn .45s ease-out .68s forwards;
  }

  .stakeholder-engagement-flow__party {
    opacity: 0;
    transform: translateY(6px);
    animation: stakeholderFlowV5PartyIn .40s ease-out forwards;
  }

  .stakeholder-engagement-flow__party:nth-child(1) { animation-delay: .78s; }
  .stakeholder-engagement-flow__party:nth-child(2) { animation-delay: .84s; }
  .stakeholder-engagement-flow__party:nth-child(3) { animation-delay: .90s; }
  .stakeholder-engagement-flow__party:nth-child(4) { animation-delay: .96s; }
  .stakeholder-engagement-flow__party:nth-child(5) { animation-delay: 1.02s; }
  .stakeholder-engagement-flow__party:nth-child(6) { animation-delay: 1.08s; }
  .stakeholder-engagement-flow__party:nth-child(7) { animation-delay: 1.14s; }
  .stakeholder-engagement-flow__party:nth-child(8) { animation-delay: 1.20s; }
  .stakeholder-engagement-flow__party:nth-child(9) { animation-delay: 1.26s; }

  .stakeholder-engagement-flow__record,
  .stakeholder-engagement-flow__footer {
    opacity: 0;
    transform: translateY(7px);
    animation: stakeholderFlowV5BlockIn .5s ease-out forwards;
  }

  .stakeholder-engagement-flow__record { animation-delay: 1.38s; }
  .stakeholder-engagement-flow__footer { animation-delay: 1.52s; }

  .stakeholder-engagement-flow::before {
    opacity: 0;
    animation: stakeholderFlowV5GhostIn .85s ease-out 1.05s forwards;
  }
}

@keyframes stakeholderFlowV5HeaderIn {
  to { opacity: 1; transform: translateY(0); }
}

@keyframes stakeholderFlowV5BlockIn {
  to { opacity: 1; transform: translateY(0); }
}

@keyframes stakeholderFlowV5PartyIn {
  to { opacity: 1; transform: translateY(0); }
}

@keyframes stakeholderFlowV5GhostIn {
  to { opacity: 1; }
}

@media (max-width: 1279px) {
  .stakeholder-engagement-flow-sidebar {
    border-top: 1px solid rgb(244 244 245) !important;
    border-left: 0 !important;
  }

  .stakeholder-engagement-flow {
    height: auto;
    overflow: visible;
    padding: 2.5rem 1rem 3rem;
  }

  .stakeholder-engagement-flow__inner {
    max-width: 44rem;
  }
}

@media (max-width: 639px) {
  .stakeholder-engagement-flow__header h2 {
    font-size: 1.75rem;
  }

  .stakeholder-engagement-flow__intro {
    font-size: .72rem;
    line-height: 1.25rem;
  }

  .stakeholder-engagement-flow__party {
    grid-template-columns: 1.55rem minmax(0, 1fr) auto;
    gap: .55rem;
  }

  .stakeholder-engagement-flow__party-copy {
    max-width: 13rem;
  }

  .stakeholder-engagement-flow__party-state {
    font-size: .42rem;
    padding-inline: .32rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .stakeholder-engagement-flow__party,
  .stakeholder-engagement-flow__party-index,
  .stakeholder-engagement-flow__progress-bar,
  .stakeholder-engagement-flow__progress-head,
  .stakeholder-engagement-flow__record-item,
  .stakeholder-engagement-flow__status-copy,
  .stakeholder-engagement-flow__record-id {
    transition: none;
  }
}
