/* Match the document canvas while preserving native scroll gestures. */
html { background: #f6f7fa; }

/* Shared page frame for every active public and signed-in layout.
   The outer main fills spare viewport height. Cards remain content-sized inside it.
   Keep page/card widths, padding and surfaces off .ff-shell__main. */
body.ff-shell {
  box-sizing: border-box; margin: 0; padding: 0; width: 100%; max-width: none;
  min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column;
}
body.ff-shell > header { flex: 0 0 auto; }
body.ff-shell > main.ff-shell__main {
  box-sizing: border-box; flex: 1 0 auto; display: block;
  width: 100%; max-width: none; height: auto; min-height: 0; max-height: none;
  margin: 0; padding: 0; overflow: visible;
  border: 0; border-radius: 0; box-shadow: none; background: transparent;
}
body.ff-shell > footer.ff-foot {
  box-sizing: border-box; flex: 0 0 auto; display: block; position: static;
  width: 100%; height: auto; margin: 0;
}
/* Public pages have a white reading surface; app pages use the gray page surface. */
body.ff-page { background: #f6f7fa; }
body.ff-page > main.ff-shell__main { background: #fff; }

/* The app background must fill spare space when a banner is dismissed or content is short.
   Legacy full-width sections inherit that surface instead of painting a separate band. */
body.ff-shell--app > main.ff-shell__main,
body.ff-shell--app .main--section { background: transparent; }

/* The legacy account navbar is a full-width bar, without a white lower edge or rounded corners. */
body.ff-shell--app .header-new .navbar { border-bottom: 0 !important; border-radius: 0; }