The HoopAI website now resolves light or dark presentation from the visitor's operating-system preference unless a valid theme override is already present. The maintenance work corrected a site-wide light-mode pin, moved theme selection into the document head before paint, addressed known hardcoded-color defects, and standardized favicon delivery. This was an accessibility and rendering update to the website, with the exported Webflow appearance retained as the reference.
Theme preference at page load
Webflow's convention gives an explicit light or dark class or data-theme value priority over the operating system. Without an override, prefers-color-scheme decides. The Astro port had hardcoded the light value on both page shells, which made the system preference unreachable. Removing that pin restored the intended decision path.
Both MarketingShell and CloneShell now load the same theme bootstrap component first in the document head. It updates the root class, theme attribute, and browser color scheme, then handles theme-specific image sources and late-added nodes. Replay filters prevent a second copy of the same bootstrap logic from running later.
Avoiding a light flash
The earlier bootstrap code was replayed near the end of the document body even though it was described as pre-paint. Fast local loading made the delay hard to see, but a real connection could display the light page before applying dark styles. Moving the resolver ahead of CSS and page rendering closes that timing gap.
Dark style corrections live in shared shell overrides when Webflow contains a literal light-only color. The durable note lists fixes for borders, text tokens, illustration frames, placeholder assets, and selected monochrome logos. This placement keeps the exported island HTML unchanged and gives both passthrough and CMS pages the same correction surface.
Self-hosted favicon assets
CMS pages initially lacked favicon links, and earlier passthrough icons depended on Webflow-hosted files. The current shell output owns a light and dark favicon pair under the site's public assets. Media queries allow the browser to select the appropriate icon without waiting for JavaScript, while default, shortcut, and touch links provide the expected formats.
The runtime filters remove icon links from imported island heads and prevent an older favicon normalizer from rewriting the owned paths. This matters because a later script should not return the tab icon to a retired external URL. Both shells now emit the same owned icon set and keep it stable after the page loads.
Scope of the maintenance update
The work covered the theme mechanism and the verified page-level defects found during the audit. It did not manufacture dark versions of raster or video media that exist only in light form. Those assets can receive restrained framing or inversion where appropriate, but a true dark recording or illustration needs separate asset production and content-model support.
Automated checks compare the hand-authored dark token blocks between shells and report conflicts with Webflow's native styles. Browser verification checks computed styles, structure, icon URLs, and both shell types. The maintenance boundary remains concrete: follow the visitor's preference before paint, keep shared tokens aligned, and document media that still needs an authored dark counterpart.
