/* rapple-look.css - one look across every Rapple OS screen.
   Typography and page colour only. No layout, no spacing, no component rules,
   so it cannot move anything on a page. Loaded LAST so it wins on the few
   screens that set their own font. */
body, button, input, select, textarea {
  font-family: Figtree, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}
body { font-size: 16px; }
body:not(.rapDark) { background: #FAF8F2; }

/* --- Page alignment, 31 Aug 2026 -------------------------------------------
   Every page carries an injected block (id="rapWide") that caps each direct
   child of body at 1560px but never centres it. The content panel underneath
   has its own margin:0 auto, so it centred while the dark top bar and the
   masthead stayed pinned hard left. On a wide screen that gives a black band
   stopping two thirds across, white beside it, and the page title sitting
   ~180px left of the content below.
   Fix: the bars go full width and their contents sit on the same centre line
   as the page. "html body > nav" outranks "body > *", so this wins wherever
   it loads. Below 1200px nothing changes.
   --------------------------------------------------------------------------- */
@media (min-width: 1200px) {
  html body > nav,
  html body > header {
    max-width: none !important;
    width: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: max(12px, calc((100% - 1560px) / 2)) !important;
    padding-right: max(12px, calc((100% - 1560px) / 2)) !important;
  }
}