.mobileOnly { display: block; }
.desktopOnly { display: none; }

.ff-app-shell {
  min-height: 100dvh;
  background:
    radial-gradient(circle at top left, rgba(31, 79, 216, 0.08), transparent 32rem),
    var(--ff-bg);
}

.ff-page {
  width: 100%;
  max-width: var(--ff-page-width);
  margin: 0 auto;
  padding-inline: var(--ff-space-5);
}

.ff-reading,
.ffReadingWidth {
  max-width: var(--ff-reading-width);
  margin-inline: auto;
}

.ff-hero {
  max-width: var(--ff-hero-width);
  margin-inline: auto;
  text-align: center;
}

.ffLearningWidth { max-width: var(--ff-learning-width); margin-inline: auto; }
.ffCockpitWidth { max-width: var(--ff-cockpit-width); margin-inline: auto; }

@media (min-width: 768px) {
  .ff-page { padding-inline: var(--ff-space-10); }
}

@media (min-width: 1024px) {
  .mobileOnly { display: none; }
  .desktopOnly { display: block; }
}