/* ============================================================
   Reset — box-sizing, base elements, typography defaults
   ============================================================ */

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

html, body {
  /* page surface uses the slightly-warmer --bg-soft so cards/heroes pop;
     pure white --bg is reserved for component surfaces. */
  background: var(--bg-soft);
  color: var(--fg);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: clip;
}

html {
  scroll-behavior: smooth;
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

body {
  font-size: var(--text-base);
  line-height: var(--lh-relaxed);
  letter-spacing: var(--ls-snug);
  text-rendering: optimizeLegibility;
}

::selection { background: var(--hot); color: var(--fg); }

a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
input, textarea, select { font: inherit; color: inherit; }