/* Responsive integration of the supplied Dashboard; component sources unchanged. */
#root a,
#root button {
  min-height: 44px;
}
#root main,
#root main * {
  min-width: 0;
}
#root .category-shelf {
  margin-block: 0;
}
#root .category-shelf > a {
  overflow-wrap: anywhere;
}
@media (max-width: 1099px) {
  #root .category-shelf {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}
@media (max-width: 600px) {
  #root header {
    height: auto !important;
    min-height: var(--appbar-height);
    flex-wrap: wrap;
    padding: var(--space-3) var(--space-4) !important;
    gap: var(--space-3) !important;
  }
  #root main {
    padding-inline: var(--space-4) !important;
  }
  #root main > section:first-child,
  #root .landing-actions,
  #root .landing-features {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  #root main > section:first-child > div:first-child {
    padding: var(--space-6) !important;
  }
  #root main > section:first-child h1 {
    font: var(--text-section) !important;
  }
  #root main > section:last-child {
    flex-wrap: wrap;
    padding: var(--space-5) !important;
  }
  #root main button,
  #root main a {
    white-space: normal !important;
  }
  #root main button span,
  #root main a span {
    white-space: normal !important;
  }
}

/* How many answers are behind this door. Quiet: the tile's job is still the category name. */
.tile-count {
  display: block;
  margin-top: var(--space-2, 8px);
  font-size: var(--size-body-sm, 0.8125rem);
  font-variant-numeric: tabular-nums;
  color: var(--text-muted, #5b6b82);
}