/* Compact first viewport for the public predictions page. */
@media (min-width: 900px) {
  .predictions-page,
  .predictions-main,
  .customer-predictions-page {
    padding-top: 18px !important;
  }

  .predictions-hero,
  .predictions-header,
  .page-heading--compact {
    min-height: 0 !important;
    padding-top: 18px !important;
    padding-bottom: 10px !important;
    margin-bottom: 8px !important;
  }

  .predictions-hero h1,
  .predictions-header h1,
  .page-heading--compact h1 {
    margin: 4px 0 2px !important;
    font-size: clamp(2.25rem, 3.5vw, 3.6rem) !important;
    line-height: .98 !important;
  }

  .predictions-hero p,
  .predictions-header p,
  .page-heading--compact p {
    margin: 8px 0 0 !important;
  }

  .predictions-toolbar,
  .predictions-controls,
  .prediction-filters {
    margin-top: 12px !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 10px !important;
    row-gap: 10px !important;
  }

  .market-tabs,
  .prediction-market-tabs,
  .predictions-categories {
    margin-top: 8px !important;
    margin-bottom: 0 !important;
    padding-bottom: 8px !important;
  }

  .predictions-section,
  .predictions-results,
  .predictions-list-section,
  #predictionsSection {
    margin-top: 18px !important;
    padding-top: 0 !important;
  }

  .predictions-section-header,
  .predictions-list-header,
  .section-heading {
    margin-top: 0 !important;
    margin-bottom: 10px !important;
  }

  .predictions-help,
  .predictions-explainer,
  .prediction-help-row {
    margin: 8px 0 12px !important;
  }

  .predictions-grid,
  .prediction-grid {
    margin-top: 0 !important;
    gap: 16px !important;
  }
}

@media (max-width: 899px) {
  .predictions-hero,
  .predictions-header,
  .page-heading--compact {
    padding-top: 16px !important;
    padding-bottom: 8px !important;
    margin-bottom: 8px !important;
  }

  .predictions-section,
  .predictions-results,
  .predictions-list-section,
  #predictionsSection {
    margin-top: 16px !important;
    padding-top: 0 !important;
  }
}
