@media (max-width: 1120px) {
  .workflow-product-wordmark,
  .workflow-account {
    display: none;
  }

  .create-grid,
  .review-grid {
    grid-template-columns: 1fr;
  }

  .audience-card,
  .message-card {
    min-height: 0;
  }
}

@media (max-width: 860px) {
  :root {
    --workflow-height: 65px;
    --workflow-spine-y: 40.5px;
    --workflow-track-width: min(640px, calc(100vw - 28px));
  }

  .shell {
    width: min(100% - 24px, var(--max-width));
    padding-top: 20px;
  }

  .stage-card {
    padding: 22px 18px;
    border-radius: 22px;
  }

  .stage-head,
  .stage-footer,
  .work-card-head,
  .section-mini-head,
  .preview-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .stage-head .button,
  .stage-footer .button,
  .work-card-head .button {
    width: 100%;
  }

  .mapping-grid {
    grid-template-columns: 1fr;
  }

  .review-artifact,
  .send-ready-card {
    grid-template-columns: 1fr;
  }

  .review-artifact {
    align-items: stretch;
  }

  .review-artifact-counts {
    width: 100%;
  }

  .send-action-panel {
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    border-left: 0;
  }

  .preview-navigation {
    width: 100%;
  }

  .preview-navigation select {
    width: auto;
    min-width: 0;
    flex: 1;
  }

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

  .delivery-counts div:last-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 560px) {
  .launch-screen {
    align-items: flex-start;
    overflow-y: auto;
    padding-top: 80px;
  }

  .launch-title {
    font-size: clamp(3rem, 16vw, 4rem);
  }

  .workflow-rail {
    padding: 0 8px;
  }

  .workflow-step-label {
    font-size: 0.84rem;
  }

  .stage-title {
    font-size: 2.35rem;
  }

  .compact-actions,
  .panel-actions,
  .audience-empty-actions {
    width: 100%;
    align-items: stretch;
    flex-direction: column;
  }

  .audience-empty {
    min-height: 370px;
    padding: 28px 18px;
  }

  .sender-card {
    grid-template-columns: 38px minmax(0, 1fr);
  }

  .sender-state {
    grid-column: 1 / -1;
    justify-self: start;
  }

  .review-artifact-counts {
    grid-template-columns: 1fr;
  }

  .review-artifact-counts div {
    min-height: 58px;
  }

  .email-preview-meta div {
    grid-template-columns: 48px minmax(0, 1fr);
  }

  .delivery-counts {
    grid-template-columns: 1fr;
  }

  .delivery-counts div:last-child {
    grid-column: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto;
    transition-duration: 0.01ms;
    animation-duration: 0.01ms;
    animation-iteration-count: 1;
  }
}

[hidden] {
  display: none;
}