/* ──────────────────────────────────────────────────────────────────
NatorOS · responsive overrides
──────────────────────────────────────────────────────────────────
The site is built with inline styles inside React components, so
instead of rewriting every component we use CSS attribute selectors
like [style*="grid-template-columns: 1fr 1fr 1fr"] to find inline
patterns and override them with !important at narrow viewports.
This file is loaded by every HTML entry point AS A REGULAR ,
so it applies BEFORE React mounts. It also keeps the FOUC styled.
────────────────────────────────────────────────────────────────── */
/* Always-on: never let the page horizontal-scroll.
Use `clip` instead of `hidden` — `hidden` implicitly forces overflow-y:auto
which creates a scroll container and breaks `position: sticky` on descendants
(the sticky nav sticks to body instead of viewport). `clip` clips without
establishing a scroll context. Safari 16+, all modern browsers. */
html, body { overflow-x: clip; max-width: 100%; }
img, svg, video { max-width: 100%; }
/* Hide the pre-hydration SEO/crawler fallback that lives inside #root.
It exists for non-rendering crawlers (LLM scrapers, OG generators)
that parse raw HTML — they still see it in the response. React
replaces #root entirely when it mounts, so this rule only matters
for the brief paint between HTML parse and React hydration. The
inline