/* Poise — minimal base styles for canvases consuming the tokens. */

:root {
  color-scheme: dark;
}

.poise-canvas {
  background: var(--bg-canvas);
  color: var(--text-primary);
  font-family: var(--font-sans);
  font-size: var(--text-body);
  line-height: var(--leading-body);
  -webkit-font-smoothing: antialiased;
  /* This is a fixed-layout app mockup (absolute-positioned chrome, fixed-
     height cards) built assuming a known text size - it has no reflow
     story for larger text. Mobile browsers (notably Chrome/Android) boost
     font sizes when the visitor has a text-size/font-size accessibility
     setting turned up, even for px-declared text; that inflation is what
     was pushing buttons off-screen. Opting out keeps the mockup legible
     and intact, at the cost of not respecting that OS/browser preference
     on this page specifically. */
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}