*{box-sizing:border-box}
/* The document does not scroll. Every scrolling region in the product is a `ScrollView` with a
   fixed thing above or below it, and a document that can also scroll takes those with it: on a
   phone the whole conversation moved, header and composer included, instead of the words alone.
   The same thing happens one level up when a keyboard opens: the browser puts the focused field
   in view by scrolling the nearest ancestor that can, and typing in search took the band with it.
   `dvh` and not `vh`: `100vh` is the window with the keyboard closed, so on a phone it is
   taller than what is there. `%` stays in front of it for anything that has not heard of it. */
html,body{height:100%;height:100dvh;margin:0;overflow:hidden;overscroll-behavior:none}
/* The mount is the app: React Native Web lays out inside it, and a root that is only as tall as
   its content makes every `flex: 1` in the product mean nothing. `height` and not `min-height`,
   or the root grows past the window and every `flex: 1` under it grows with it. */
#rally{display:flex;flex-direction:column;height:100%;height:100dvh;min-height:0;overflow:hidden}
/* The page behind the app, for the moment before React paints and for the overscroll rubber band.
   Told to the browser as well, so form controls and scrollbars match rather than fight. */
:root{color-scheme:light dark}
/* The one face this product ships, and the only place it is named. Served from this origin
   because the policy here allows fonts from nowhere else, which is also why it is copied in at
   build time rather than fetched from anybody at run time. */
@font-face{font-family:"Varien";src:url(/fonts/varien.otf) format("opentype");font-weight:normal;font-style:normal;font-display:swap}
:root{--rally-brand:"Varien",ui-rounded,"Segoe UI Variable Display",system-ui,sans-serif}
body{background:#eef1f5;font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
@media (prefers-color-scheme: dark){body{background:#171b21}}