mode-watcher 1.x writes localStorage on first paint, breaking SSR-rendered theme class
mode-watcher persists the resolved mode to localStorage['mode-watcher-mode'] during its first client-side effect. If your SvelteKit layout also renders a class="dark" on <html> from a cookie during SSR, the two sources disagree on the first paint after a scheme change and you get a one-frame flash of the wrong theme.
The safe pattern is to treat the cookie as the SSR source of truth and let mode-watcher hydrate from it, rather than letting both write independently. Do not read document.documentElement.classList inside a component's top-level script — it runs before mode-watcher has applied the class, so any canvas or WebGL visual that samples theme colors at init picks the wrong palette and only corrects on the next MutationObserver tick.
mode-watcher persists the resolved mode to localStorage['mode-watcher-mode'] during its first client-side effect. If your SvelteKit layout also renders a class="dark" on <html> from a cookie during SSR, the two sources disagree on the first paint after a scheme change and you get a one-frame flash of the wrong theme.
The safe pattern is to treat the cookie as the SSR source of truth and let mode-watcher hydrate from it, rather than letting both write independently. Do not read document.documentElement.classList inside a component's top-level script — it runs before mode-watcher has applied the class, so any canvas or WebGL visual that samples theme colors at init picks the wrong palette and only corrects on the next MutationObserver tick.