/* ===== Base reset =====
   The universal box-sizing reset and the themed document-level html/body rules (scroll
   behavior, the overflow-x: clip horizontal-overflow guard, the paper-themed scrollbar), built on
   tokens.css (linked first). landing.css and portal-shell.css build on both. index.html
   decomposition slice 9 (README_BACKLOG.md); the tokens moved to tokens.css in PT5. */

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
html {
  scroll-behavior: smooth;
  /* Contain horizontal overflow so the page can never be wider than the
     device. The scroll-reveal animations below start slid off to the side
     (.reveal--right = translateX(50px)); un-revealed elements would push the
     document ~50px past the viewport, and on mobile that widens the layout
     viewport (device-width 390 -> ~441) so the whole page renders zoomed-out
     and the sticky nav / portal drawer land off-center (issue #294). `clip`
     (not `hidden`) clips the overflow WITHOUT establishing a scroll
     container, so #siteNav's position:sticky keeps working. */
  overflow-x: clip;
  /* Themed DOCUMENT scrollbar (paper/ink tokens, same convention as
     .lobby-chat-messages/.event-scroller further down) instead of the
     bare OS default — this is the whole-page scrollbar for the landing
     page itself, distinct from the dark drawer's own #navSidebar/
     #contentArea scrollbars. */
  scrollbar-width: thin;
  scrollbar-color: var(--ink-mute) var(--paper);
}
html::-webkit-scrollbar {
  width: 10px;
}
html::-webkit-scrollbar-track {
  background: var(--paper);
}
html::-webkit-scrollbar-thumb {
  background: var(--ink-mute);
  border-radius: var(--r-sm);
  border: 2px solid var(--paper);
  background-clip: padding-box;
}
html::-webkit-scrollbar-thumb:hover {
  background: var(--ink-soft);
  background-clip: padding-box;
}
body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--kalam);
  font-weight: 400;
  line-height: 1.45;
  min-height: 100vh;
  overflow-x: clip;
}
