/* ─── Royal Price Tracker — Nav header space reservation (CLS fix) ──────────── nav.js injects #rpt-nav-header into the top of after the page loads. As an in-flow sticky element it pushes all content down by its height the moment it lands — a Cumulative Layout Shift (Google Search Console flagged /dashboard at CLS 0.76 because of this + the old runtime Tailwind CDN). This stylesheet is render-blocking (linked in ), so the space is reserved at first paint and the header is pinned as a FIXED overlay instead of adding to the flow — content starts in its final position and never jumps. Visually identical to the previous sticky header (which was already pinned to the top through the whole scroll). Link ONLY on pages that load /shared/nav.js. Header height = logo 2.5rem + 1rem padding ×2 (0.75rem ×2 on desktop). `!important` out-specifies nav.js's runtime `position: sticky` rule regardless of injection order. ──────────────────────────────────────────────────────────────────────────── */ body { padding-top: 72px; } @media (min-width: 1024px) { body { padding-top: 64px; } } #rpt-nav-header { position: fixed !important; left: 0; right: 0; top: 0; }