/* Loaded first, before any bundled stylesheet (see index.html). It lives in a
   file, not inline, so the Content-Security-Policy can use style-src 'self'
   with no hashes. */

/* The app's cascade layer order, declared before any stylesheet loads.
   A later layer always wins over an earlier one, whatever the selector
   specificity or the order route CSS arrives in. */
@layer base, tokens, components, pages, motion;

/* Paint the installed-app canvas before JavaScript and bundled CSS load.
   This prevents a neutral/gray launch strip from flashing at either edge. */
@layer base {
  html, body, #root { width: 100%; min-height: 100%; margin: 0; background: #fffdfc; }
  html[data-theme='dark'], html[data-theme='dark'] body, html[data-theme='dark'] #root { background: #020b1b; }
}