#runs-view .workflow-intro.ym-dashboard-surface > #xero-invoice-preview-panel.ym-dashboard-primary-xero-panel {
  margin: 24px 0 24px !important;
}

#runs-view .workflow-intro.ym-dashboard-surface > #xero-invoice-preview-panel.ym-dashboard-primary-xero-panel .panel-header h2 {
  font-size: clamp(30px, 4vw, 46px) !important;
}

#runs-view .workflow-intro.ym-dashboard-surface > #xero-invoice-preview-panel.ym-dashboard-primary-xero-panel .helper-text {
  max-width: 760px !important;
}

#runs-view .workflow-intro.ym-dashboard-surface > .ym-dashboard-header-actions.ym-dashboard-actions-lower-slot {
  display: grid !important;
  grid-template-columns: minmax(220px, 0.8fr) minmax(260px, 1fr) !important;
  gap: 16px !important;
  width: min(760px, 100%) !important;
  margin: 26px auto 24px !important;
  align-items: center !important;
}

#runs-view .workflow-intro.ym-dashboard-surface > .ym-dashboard-header-actions.ym-dashboard-actions-lower-slot .ym-dashboard-date-pill,
#runs-view .workflow-intro.ym-dashboard-surface > .ym-dashboard-header-actions.ym-dashboard-actions-lower-slot .ym-dashboard-primary-action {
  width: 100% !important;
  justify-content: center !important;
}

#runs-view > .workflow-intro.ym-dashboard-surface {
  margin-top: 0 !important;
}

@media (max-width: 760px) {
  #runs-view .workflow-intro.ym-dashboard-surface > #xero-invoice-preview-panel.ym-dashboard-primary-xero-panel {
    margin: 22px 0 22px !important;
    padding: 28px 18px 24px !important;
    border-radius: 28px !important;
  }

  #runs-view .workflow-intro.ym-dashboard-surface > #xero-invoice-preview-panel.ym-dashboard-primary-xero-panel .panel-header {
    display: grid !important;
    gap: 18px !important;
  }

  #runs-view .workflow-intro.ym-dashboard-surface > #xero-invoice-preview-panel.ym-dashboard-primary-xero-panel .panel-header h2 {
    font-size: clamp(36px, 10vw, 44px) !important;
    line-height: 1.08 !important;
  }

  #runs-view .workflow-intro.ym-dashboard-surface > #xero-invoice-preview-panel.ym-dashboard-primary-xero-panel .helper-text {
    font-size: 18px !important;
    line-height: 1.55 !important;
  }

  #runs-view .workflow-intro.ym-dashboard-surface > #xero-invoice-preview-panel.ym-dashboard-primary-xero-panel .xero-preview-controls {
    display: none !important;
  }

  #runs-view .workflow-intro.ym-dashboard-surface > .ym-dashboard-header-actions.ym-dashboard-actions-lower-slot {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    width: 100% !important;
    margin: 24px 0 22px !important;
  }

  #runs-view .workflow-intro.ym-dashboard-surface > .ym-dashboard-header-actions.ym-dashboard-actions-lower-slot .ym-dashboard-date-pill,
  #runs-view .workflow-intro.ym-dashboard-surface > .ym-dashboard-header-actions.ym-dashboard-actions-lower-slot .ym-dashboard-primary-action {
    min-height: 62px !important;
    border-radius: 999px !important;
  }

  #runs-view > .workflow-intro.ym-dashboard-surface {
    margin-top: 0 !important;
  }
}
