/* Box-model reset + base body styles. No scroll-behavior: smooth on html, it fights Lenis (see the
   smooth scroll rule in the Cement standards). Add Lenis's classes here when the project uses it. */

*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

:root {
  scrollbar-color: var(--theme-color-accent) transparent;
  scrollbar-width: thin;
}

/* `html ::selection` for the same reason as `html body` below: the parent's app.css
   also sets ::selection, and this outranks it whatever the load order. */
html ::selection {
  background: var(--theme-color-accent);
  color: var(--theme-color-contrast);
}

/* `html body` (not bare `body`) deliberately outranks the parent
   theme's own unscoped `body { color: var(--cmt-color-text) }` rule
   (app.css) regardless of stylesheet load order. That rule is meant
   only for the parent's own pages, but nothing currently scopes it. */
html body {
  font-family: var(--theme-font-body);
  color: var(--theme-color-text);
  background: var(--theme-color-background);
  -webkit-font-smoothing: antialiased;
}