.workflow-sequence-story {
  margin-top: 25px;
  position: relative;
}

.workflow-sequence-scene {
  align-items: stretch;
  display: grid;
  gap: clamp(1.25rem, 2.2vw, 2.25rem);
  grid-template-columns:
    minmax(260px, 0.48fr)
    minmax(330px, 0.62fr)
    minmax(280px, 0.5fr);
}

.workflow-step-column {
  display: grid;
  gap: 1rem;
}

.workflow-step-panel {
  background: rgba(13, 13, 28, 0.78);
  border: 1px solid rgba(147, 197, 253, 0.28);
  border-radius: 1rem;
  box-shadow: 0 20px 64px rgba(0, 0, 0, 0.35);
  opacity: 0;
  padding: 1.35rem;
  transform: translateY(18px) scale(0.98);
  transition:
    opacity 360ms ease,
    transform 420ms ease,
    border-color 360ms ease,
    box-shadow 360ms ease;
  width: 100%;
}

.workflow-step-panel h3 {
  color: #fff;
  font-size: clamp(1.15rem, 1.7vw, 1.55rem);
  font-weight: 760;
  line-height: 1.15;
  margin: 0.75rem 0 0.35rem;
}

.workflow-step-panel p {
  color: #aeb5c6;
  font-size: 0.95rem;
  line-height: 1.55;
  margin: 0;
}

.workflow-step-kicker {
  color: #9ca3af !important;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  margin-bottom: 0.65rem !important;
  text-transform: uppercase;
}

.workflow-step-icon {
  align-items: center;
  display: flex;
  height: 2.5rem;
}

.workflow-step-icon.is-mission {
  justify-content: space-between;
}

.workflow-step-avatar-stack,
.workflow-step-integration-stack {
  align-items: center;
  display: flex;
}

.workflow-step-integration-stack {
  justify-content: flex-end;
  margin-left: auto;
  padding-left: 0.75rem;
}

.workflow-step-icon img {
  background: #020617;
  border: 2px solid rgba(142, 190, 255, 0.8);
  border-radius: 999px;
  height: 2rem;
  object-fit: cover;
  width: 2rem;
}

.workflow-step-integration-stack img {
  background: #fff;
  border-color: rgba(147, 197, 253, 0.64);
  object-fit: contain;
  padding: 0.16rem;
}

.workflow-step-icon.is-stack img,
.workflow-step-avatar-stack img,
.workflow-step-integration-stack img {
  margin-left: -0.65rem;
}

.workflow-step-icon.is-stack img:first-child,
.workflow-step-avatar-stack img:first-child,
.workflow-step-integration-stack img:first-child {
  margin-left: 0;
}

.workflow-sequence-step-1-panel .workflow-step-panel.is-step-1,
.workflow-sequence-step-1-animate .workflow-step-panel.is-step-1,
.workflow-sequence-step-2-panel .workflow-step-panel.is-step-1,
.workflow-sequence-step-2-panel .workflow-step-panel.is-step-2,
.workflow-sequence-step-2-animate .workflow-step-panel.is-step-1,
.workflow-sequence-step-2-animate .workflow-step-panel.is-step-2,
.workflow-sequence-step-3-panel .workflow-step-panel,
.workflow-sequence-step-3-animate .workflow-step-panel,
.workflow-sequence-updates .workflow-step-panel,
.workflow-sequence-complete .workflow-step-panel {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.workflow-sequence-step-1-panel .workflow-step-panel.is-step-1,
.workflow-sequence-step-1-animate .workflow-step-panel.is-step-1,
.workflow-sequence-step-2-panel .workflow-step-panel.is-step-2,
.workflow-sequence-step-2-animate .workflow-step-panel.is-step-2,
.workflow-sequence-step-3-panel .workflow-step-panel.is-step-3,
.workflow-sequence-step-3-animate .workflow-step-panel.is-step-3,
.workflow-sequence-updates .workflow-step-panel.is-step-3,
.workflow-sequence-complete .workflow-step-panel.is-step-3 {
  border-color: rgba(96, 165, 250, 0.64);
  box-shadow:
    0 20px 64px rgba(0, 0, 0, 0.35),
    0 0 36px rgba(51, 116, 255, 0.12);
}

.workflow-animation-stage {
  height: 100%;
  min-height: 595px;
  overflow-x: visible;
  overflow-y: hidden;
  position: relative;
}

.workflow-side-column {
  height: 100%;
  min-height: 595px;
  position: relative;
}

.workflow-step-switcher {
  align-items: center;
  display: inline-flex;
  gap: 0.7rem;
  justify-content: center;
  margin: 1.25rem auto 0;
  width: 100%;
}

.workflow-step-switcher-button {
  align-items: center;
  background: rgba(13, 13, 28, 0.78);
  border: 1px solid rgba(147, 197, 253, 0.3);
  border-radius: 999px;
  color: #cbd5e1;
  cursor: pointer;
  display: inline-flex;
  height: 2.15rem;
  justify-content: center;
  transition:
    border-color 180ms ease,
    color 180ms ease,
    opacity 180ms ease,
    box-shadow 180ms ease;
  width: 2.15rem;
}

.workflow-step-switcher-button:hover,
.workflow-step-switcher-button:focus-visible {
  border-color: rgba(96, 165, 250, 0.78);
  box-shadow: 0 0 24px rgba(51, 116, 255, 0.16);
  color: #fff;
}

.workflow-step-switcher-button:disabled {
  cursor: default;
  opacity: 0.35;
}

.workflow-step-switcher-button:disabled:hover {
  border-color: rgba(147, 197, 253, 0.3);
  box-shadow: none;
  color: #cbd5e1;
}

.workflow-step-switcher-button:focus-visible {
  outline: 2px solid rgba(96, 165, 250, 0.7);
  outline-offset: 3px;
}

.workflow-step-switcher-button svg {
  height: 1rem;
  width: 1rem;
}

.workflow-step-switcher-button path {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.workflow-step-indicators {
  align-items: center;
  background: rgba(13, 13, 28, 0.78);
  border: 1px solid rgba(147, 197, 253, 0.18);
  border-radius: 999px;
  display: inline-flex;
  gap: 0.45rem;
  min-height: 2.15rem;
  padding: 0 0.72rem;
}

.workflow-step-dot {
  border: 1px solid rgba(147, 197, 253, 0.62);
  border-radius: 999px;
  height: 0.52rem;
  transition:
    background-color 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
  width: 0.52rem;
}

.workflow-step-dot.is-active {
  background: #599aff;
  border-color: #599aff;
  box-shadow: 0 0 14px rgba(89, 154, 255, 0.5);
}

.workflow-mission-banner {
  background: rgba(10, 10, 20, 0.88);
  border: 1px solid rgba(96, 165, 250, 0.38);
  border-radius: 999px;
  box-sizing: border-box;
  color: #fff;
  font-size: clamp(0.86rem, 1.12vw, 1rem);
  font-weight: 800;
  left: 50%;
  opacity: 0;
  padding: 0.75rem 1rem;
  position: absolute;
  text-align: center;
  top: 0;
  transform: translate(-50%, -12px);
  transition: opacity 420ms ease, transform 420ms ease;
  white-space: nowrap;
  width: min(29.5rem, calc(100% - 1rem));
  z-index: 6;
}

.workflow-mission-label {
  animation: workflow-mission-label-flare 2.4s ease-in-out infinite;
  color: #93c5fd;
}

.workflow-sequence-step-3-animate .workflow-mission-banner,
.workflow-sequence-updates .workflow-mission-banner,
.workflow-sequence-complete .workflow-mission-banner {
  opacity: 1;
  transform: translate(-50%, 0);
}

.workflow-connection-layer {
  display: block;
  height: 100%;
  inset: 0;
  opacity: 0;
  overflow: visible;
  pointer-events: none;
  position: absolute;
  transition: opacity 360ms ease 180ms;
  width: 100%;
  z-index: 3;
}

.workflow-team-line {
  stroke: rgba(34, 211, 238, 0.68);
  stroke-linecap: round;
  stroke-opacity: var(--edge-opacity, 0.68);
  stroke-width: calc(var(--edge-width, 3.8) + 1.6px);
  transition: stroke-opacity 180ms ease, stroke-width 180ms ease;
}

.workflow-team-line-reverse {
  stroke: rgba(20, 184, 166, 0.58);
}

.workflow-team-line.is-active {
  stroke: rgba(34, 211, 238, 0.96);
  stroke-opacity: 1;
  stroke-width: calc(var(--edge-width, 3.8) + 2.6px);
}

.workflow-team-line-reverse.is-active {
  stroke: rgba(20, 184, 166, 0.96);
}

.workflow-sequence-updates .workflow-connection-layer,
.workflow-sequence-complete .workflow-connection-layer {
  opacity: 1;
}

.workflow-persona {
  left: 50%;
  opacity: 0;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%) scale(0.72);
  transition:
    left 720ms cubic-bezier(0.2, 0.8, 0.2, 1),
    top 720ms cubic-bezier(0.2, 0.8, 0.2, 1),
    opacity 380ms ease,
    transform 720ms cubic-bezier(0.2, 0.8, 0.2, 1);
  z-index: 4;
}

.workflow-persona-orbit {
  height: 208px;
  position: relative;
  width: 208px;
}

.workflow-persona-avatar {
  border: 2px solid rgba(147, 197, 253, 0.88);
  border-radius: 999px;
  box-shadow:
    0 0 0 7px rgba(51, 116, 255, 0.08),
    0 0 34px rgba(96, 165, 250, 0.28);
  height: 98px;
  left: 50%;
  object-fit: cover;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 98px;
  z-index: 6;
}

.workflow-persona-orbit::before {
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 999px;
  content: "";
  inset: 36px;
  position: absolute;
  transform-box: fill-box;
  transform-origin: center;
  transition: border-color 220ms ease, border-width 220ms ease;
}

.workflow-persona.is-thinking .workflow-persona-orbit::before {
  animation: workflow-persona-ring-spin 1500ms linear infinite;
  border-color: #22c55e;
  border-left-color: transparent;
  border-right-color: transparent;
  border-width: 5px;
}

.workflow-integration {
  --radius: 84px;
  align-items: center;
  background: rgba(15, 23, 42, 0.96);
  border: 1.2px solid rgba(148, 163, 184, 0.54);
  border-radius: 999px;
  display: flex;
  height: 36px;
  justify-content: center;
  left: 50%;
  opacity: 0;
  position: absolute;
  top: 50%;
  transform:
    translate(-50%, -50%)
    rotate(var(--angle))
    translateY(calc(var(--radius) * -1))
    rotate(calc(var(--angle) * -1))
    scale(0.42);
  transition:
    opacity 240ms ease var(--delay),
    transform 380ms cubic-bezier(0.24, 1.28, 0.38, 1.05) var(--delay),
    border-color 200ms ease,
    box-shadow 200ms ease;
  width: 36px;
  z-index: 7;
}

.workflow-integration.is-active {
  animation: workflow-integration-node-pulse 1125ms ease-in-out;
  border-color: rgba(250, 204, 21, 1);
  border-width: 2.6px;
  box-shadow: 0 0 18px rgba(250, 204, 21, 0.24);
}

.workflow-integration-blast {
  border: 2px solid rgba(34, 197, 94, 0.95);
  border-radius: 999px;
  inset: -6px;
  opacity: 0;
  pointer-events: none;
  position: absolute;
}

.workflow-integration-blast::before,
.workflow-integration-blast::after {
  background: rgba(34, 197, 94, 0.95);
  border-radius: 999px;
  content: "";
  height: 2px;
  left: 50%;
  opacity: 0.9;
  position: absolute;
  top: 50%;
  width: 52px;
}

.workflow-integration-blast::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.workflow-integration-blast::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.workflow-integration-blast.is-visible {
  animation: workflow-integration-blast-ring 760ms ease-out forwards;
}

.workflow-integration-spoke {
  background: linear-gradient(90deg, rgba(34, 211, 238, 0), rgba(34, 211, 238, 0.74));
  height: 2px;
  left: 50%;
  opacity: 0;
  position: absolute;
  top: 50%;
  transform:
    rotate(calc(var(--angle) - 90deg))
    translateX(18px)
    scaleX(0);
  transform-origin: left center;
  transition:
    opacity 260ms ease var(--delay),
    transform 520ms ease var(--delay);
  width: 48px;
  z-index: 1;
}

.workflow-integration-spoke.is-active {
  background: linear-gradient(90deg, rgba(250, 204, 21, 0), rgba(250, 204, 21, 0.95));
  height: 3px;
  opacity: 1;
}

.workflow-integration img {
  display: block;
  max-height: 22px;
  max-width: 22px;
  object-fit: contain;
}

.workflow-integration.is-github,
.workflow-integration.is-perplexity,
.workflow-integration.is-wikijs {
  background: #fff;
}

.workflow-sequence-step-1-animate .is-persona-1,
.workflow-sequence-step-2-panel .is-persona-1,
.workflow-sequence-step-2-animate .workflow-persona,
.workflow-sequence-step-3-panel .workflow-persona,
.workflow-sequence-step-3-animate .workflow-persona,
.workflow-sequence-updates .workflow-persona,
.workflow-sequence-complete .workflow-persona {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.workflow-sequence-step-1-animate .is-persona-1,
.workflow-sequence-step-2-panel .is-persona-1 {
  left: 50%;
  top: 54%;
}

.workflow-sequence-step-3-panel .is-persona-1,
.workflow-sequence-step-3-animate .is-persona-1 {
  left: 50%;
  top: 24%;
}

.workflow-sequence-step-3-panel .is-persona-2,
.workflow-sequence-step-3-animate .is-persona-2 {
  left: 50%;
  top: 56%;
}

.workflow-sequence-step-3-panel .is-persona-3,
.workflow-sequence-step-3-animate .is-persona-3 {
  left: 50%;
  top: 88%;
}

.workflow-sequence-step-2-animate .is-persona-2 {
  left: 50%;
  top: 18%;
}

.workflow-sequence-step-2-animate .is-persona-1 {
  left: 50%;
  top: 50%;
}

.workflow-sequence-step-2-animate .is-persona-3 {
  left: 50%;
  top: 82%;
}

.workflow-sequence-updates .is-persona-1,
.workflow-sequence-complete .is-persona-1 {
  left: 50%;
  top: 24%;
}

.workflow-sequence-updates .is-persona-2,
.workflow-sequence-complete .is-persona-2 {
  left: 28%;
  top: 56%;
}

.workflow-sequence-updates .is-persona-3,
.workflow-sequence-complete .is-persona-3 {
  left: 69%;
  top: 88%;
}

.workflow-sequence-step-1-animate .is-persona-1 .workflow-integration,
.workflow-sequence-step-2-panel .is-persona-1 .workflow-integration,
.workflow-sequence-step-2-animate .workflow-integration,
.workflow-sequence-step-3-panel .workflow-integration,
.workflow-sequence-step-3-animate .workflow-integration,
.workflow-sequence-updates .workflow-integration,
.workflow-sequence-complete .workflow-integration {
  opacity: 1;
  transform:
    translate(-50%, -50%)
    rotate(var(--angle))
    translateY(calc(var(--radius) * -1))
    rotate(calc(var(--angle) * -1))
    scale(1);
}

.workflow-sequence-step-1-animate .is-persona-1 .workflow-integration {
  animation: workflow-step-integration-pop 560ms cubic-bezier(0.18, 0.92, 0.28, 1.22) both;
  animation-delay: calc(640ms + var(--delay));
}

.workflow-sequence-updates .workflow-integration-spoke,
.workflow-sequence-complete .workflow-integration-spoke {
  opacity: 1;
  transform:
    rotate(calc(var(--angle) - 90deg))
    translateX(18px)
    scaleX(1);
}

.workflow-responsibility-panel {
  background: rgba(13, 13, 28, 0.88);
  border: 1px solid rgba(147, 197, 253, 0.2);
  border-radius: 0.9rem;
  left: 0;
  opacity: 0;
  padding: 0.95rem 1rem;
  position: absolute;
  transform: translateX(26px);
  transition:
    opacity 360ms ease,
    transform 520ms ease;
  width: 100%;
  z-index: 5;
}

.workflow-responsibility-panel h4,
.workflow-update-inbox h4 {
  color: #93c5fd;
  font-size: 0.75rem;
  font-weight: 850;
  letter-spacing: 0.1em;
  margin: 0 0 0.45rem;
  text-transform: uppercase;
}

.workflow-update-inbox h4 {
  color: #fff;
  font-size: 0.95rem;
}

.workflow-responsibility-panel.is-persona-coder h4,
.workflow-update-card.is-actor-coder span {
  color: #facc15;
}

.workflow-responsibility-panel.is-persona-researcher h4,
.workflow-update-card.is-actor-researcher span {
  color: #4ade80;
}

.workflow-responsibility-panel.is-persona-ops h4,
.workflow-update-card.is-actor-ops span {
  color: #fb7185;
}

.workflow-responsibility-panel p,
.workflow-update-card p {
  color: #cbd5e1;
  font-size: 0.92rem;
  line-height: 1.45;
  margin: 0;
}

.workflow-responsibility-panel.is-responsibility-1 { top: 16%; }
.workflow-responsibility-panel.is-responsibility-2 { top: 41%; }
.workflow-responsibility-panel.is-responsibility-3 { top: 66%; }

.workflow-sequence-step-2-animate .workflow-responsibility-panel,
.workflow-sequence-step-3-panel .workflow-responsibility-panel,
.workflow-sequence-step-3-animate .workflow-responsibility-panel {
  opacity: 1;
  transform: translateX(0);
}

.workflow-sequence-updates .workflow-responsibility-panel,
.workflow-sequence-complete .workflow-responsibility-panel {
  opacity: 0;
  transform: translateX(60px);
}

.workflow-update-inbox {
  left: 0;
  opacity: 0;
  position: absolute;
  top: calc(13.2rem - 15px);
  transform: translateY(-10px);
  transition: opacity 360ms ease 520ms, transform 420ms ease 520ms;
  width: 100%;
  z-index: 7;
}

.workflow-sequence-updates .workflow-update-inbox,
.workflow-sequence-complete .workflow-update-inbox {
  opacity: 1;
  transform: translateY(0);
}

.workflow-update-list {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}

.workflow-update-card {
  background: rgba(13, 13, 28, 0.92);
  border: 1px solid rgba(96, 165, 250, 0.25);
  border-radius: 0.9rem;
  box-shadow: 0 18px 52px rgba(0, 0, 0, 0.32);
  opacity: 0;
  padding: 0.95rem 1.05rem;
  transform: translateY(-24px);
  transition: opacity 420ms ease, transform 520ms ease;
  will-change: opacity, transform;
}

.workflow-update-card span {
  color: #60a5fa;
  display: block;
  font-size: 0.8rem;
  font-weight: 800;
  margin-bottom: 0.32rem;
}

.workflow-sequence-updates .workflow-update-card,
.workflow-sequence-complete .workflow-update-card {
  opacity: 1;
  transform: translateY(0);
}

.workflow-update-card.is-entering {
  opacity: 0;
  transform: translateY(-28px);
}

.workflow-update-card.is-exiting {
  opacity: 0;
  transform: translateY(0);
}

@keyframes workflow-persona-ring-spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes workflow-integration-node-pulse {
  0%, 100% {
    box-shadow: 0 0 0 rgba(250, 204, 21, 0);
  }
  50% {
    box-shadow: 0 0 18px rgba(250, 204, 21, 0.28);
  }
}

@keyframes workflow-integration-blast-ring {
  0% {
    opacity: 0.95;
    scale: 0.55;
  }
  100% {
    opacity: 0;
    scale: 2.2;
  }
}

@keyframes workflow-step-integration-pop {
  0% {
    opacity: 0;
    transform:
      translate(-50%, -50%)
      rotate(var(--angle))
      translateY(calc(var(--radius) * -1))
      rotate(calc(var(--angle) * -1))
      scale(0.32);
  }
  72% {
    opacity: 1;
    transform:
      translate(-50%, -50%)
      rotate(var(--angle))
      translateY(calc(var(--radius) * -1))
      rotate(calc(var(--angle) * -1))
      scale(1.12);
  }
  100% {
    opacity: 1;
    transform:
      translate(-50%, -50%)
      rotate(var(--angle))
      translateY(calc(var(--radius) * -1))
      rotate(calc(var(--angle) * -1))
      scale(1);
  }
}

@keyframes workflow-mission-label-flare {
  0%, 100% {
    color: #93c5fd;
    text-shadow: 0 0 0 rgba(96, 165, 250, 0);
  }
  50% {
    color: #a78bfa;
    text-shadow:
      0 0 10px rgba(139, 92, 246, 0.7),
      0 0 18px rgba(34, 211, 238, 0.35);
  }
}

@media (max-width: 900px) {
  .workflow-sequence-scene {
    display: block;
  }

  .workflow-step-column {
    display: block;
    min-height: 256px;
    position: relative;
  }

  .workflow-step-panel {
    inset: 0;
    min-height: 256px;
    pointer-events: none;
    position: absolute;
    visibility: hidden;
  }

  .workflow-sequence-step-1-panel .workflow-step-panel.is-step-2,
  .workflow-sequence-step-1-panel .workflow-step-panel.is-step-3,
  .workflow-sequence-step-1-animate .workflow-step-panel.is-step-2,
  .workflow-sequence-step-1-animate .workflow-step-panel.is-step-3,
  .workflow-sequence-step-2-panel .workflow-step-panel.is-step-1,
  .workflow-sequence-step-2-panel .workflow-step-panel.is-step-3,
  .workflow-sequence-step-2-animate .workflow-step-panel.is-step-1,
  .workflow-sequence-step-2-animate .workflow-step-panel.is-step-3,
  .workflow-sequence-step-3-panel .workflow-step-panel.is-step-1,
  .workflow-sequence-step-3-panel .workflow-step-panel.is-step-2,
  .workflow-sequence-step-3-animate .workflow-step-panel.is-step-1,
  .workflow-sequence-step-3-animate .workflow-step-panel.is-step-2,
  .workflow-sequence-updates .workflow-step-panel.is-step-1,
  .workflow-sequence-updates .workflow-step-panel.is-step-2,
  .workflow-sequence-complete .workflow-step-panel.is-step-1,
  .workflow-sequence-complete .workflow-step-panel.is-step-2 {
    opacity: 0;
    transform: translateY(18px) scale(0.98);
  }

  .workflow-sequence-step-1-panel .workflow-step-panel.is-step-1,
  .workflow-sequence-step-1-animate .workflow-step-panel.is-step-1,
  .workflow-sequence-step-2-panel .workflow-step-panel.is-step-2,
  .workflow-sequence-step-2-animate .workflow-step-panel.is-step-2,
  .workflow-sequence-step-3-panel .workflow-step-panel.is-step-3,
  .workflow-sequence-step-3-animate .workflow-step-panel.is-step-3,
  .workflow-sequence-updates .workflow-step-panel.is-step-3,
  .workflow-sequence-complete .workflow-step-panel.is-step-3 {
    pointer-events: auto;
    visibility: visible;
  }

  .workflow-sequence-step-2-panel .workflow-step-panel.is-step-2,
  .workflow-sequence-step-2-animate .workflow-step-panel.is-step-2 {
    transform: translateY(-1.5rem) scale(1);
  }

  .workflow-animation-stage {
    box-sizing: border-box;
    height: 292px;
    margin-top: 5px;
    min-height: 292px;
    padding-top: 35px;
  }

  .workflow-integration-spoke {
    display: none;
  }

  .workflow-side-column {
    display: none;
  }

  .workflow-mission-banner {
    font-size: clamp(0.58rem, 2.65vw, 0.78rem);
    left: 50%;
    max-width: calc(100vw - 2rem);
    padding: 0.62rem clamp(0.5rem, 2vw, 0.85rem);
    right: auto;
    top: 0;
  }

  .workflow-sequence-step-3-panel .is-persona-1,
  .workflow-sequence-step-3-animate .is-persona-1,
  .workflow-sequence-updates .is-persona-1,
  .workflow-sequence-complete .is-persona-1 {
    left: 27%;
    top: 58%;
  }

  .workflow-sequence-step-3-panel .is-persona-2,
  .workflow-sequence-step-3-animate .is-persona-2,
  .workflow-sequence-updates .is-persona-2,
  .workflow-sequence-complete .is-persona-2 {
    left: 56%;
    top: 36%;
  }

  .workflow-sequence-step-3-panel .is-persona-3,
  .workflow-sequence-step-3-animate .is-persona-3,
  .workflow-sequence-updates .is-persona-3,
  .workflow-sequence-complete .is-persona-3 {
    left: 73%;
    top: 77%;
  }

  .workflow-sequence-step-2-animate .is-persona-2 {
    left: 56%;
    top: 36%;
  }

  .workflow-sequence-step-2-animate .is-persona-1 {
    left: 27%;
    top: 58%;
  }

  .workflow-sequence-step-2-animate .is-persona-1,
  .workflow-sequence-step-3-panel .is-persona-1,
  .workflow-sequence-step-3-animate .is-persona-1,
  .workflow-sequence-updates .is-persona-1,
  .workflow-sequence-complete .is-persona-1 {
    transform: translate(-50%, calc(-50% + 35px)) scale(1);
  }

  .workflow-sequence-step-2-animate .is-persona-3 {
    left: 73%;
    top: 77%;
  }

  .workflow-persona-orbit {
    height: 128px;
    width: 128px;
  }

  .workflow-persona-avatar {
    height: 58px;
    width: 58px;
  }

  .workflow-integration {
    --radius: 52px;
    height: 28px;
    width: 28px;
  }

  .workflow-integration img {
    max-height: 18px;
    max-width: 18px;
  }

  .workflow-responsibility-panel,
  .workflow-update-inbox {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .workflow-team-line,
  .workflow-integration,
  .workflow-mission-label,
  .workflow-persona.is-thinking .workflow-persona-orbit::before {
    animation: none !important;
  }

  .workflow-step-panel,
  .workflow-persona,
  .workflow-integration,
  .workflow-integration-spoke,
  .workflow-responsibility-panel,
  .workflow-update-card,
  .workflow-mission-banner,
  .workflow-update-inbox,
  .workflow-step-switcher-button,
  .workflow-step-dot {
    transition: none !important;
  }
}