/* Shared page canvas for learner, account and activation pages.
   Loaded directly by each page so the background never depends on login or JS. */
:root {
  --learner-page-background: #f7f6f1;
  --bg: var(--learner-page-background);
}

html,
body,
.site-shell,
.main-content {
  background: var(--learner-page-background);
}

/* Task content uses neutral text; only the two learning actions carry color. */
[data-learn-home-root][data-learning-tasks-root] .learn-home-shell :is(h1, h2, p, span, strong, small, summary, a) {
  color: var(--ink);
}

[data-learn-home-root][data-learning-tasks-root] .learn-home-shell :is([data-vocabulary-action], [data-sentences-action]) {
  color: var(--button-orange, #ff6a00);
}

/* Page-specific gradients must not cover the common canvas. */
body .learn-home-page[data-learn-home-root],
body .vocabulary-page,
body .sentences-page,
body .onboarding-page,
body .recommendations-page,
body .invite-page,
body .account-hero,
body .account-center,
body .messages-page,
body .hero,
body .activation-preview-section {
  background: var(--learner-page-background);
}