/* global React */ /* PRIME — Tweaks Three expressive axes that reshape the whole site: • Mood — palette + ambient washes (Acid / Concrete / Inferno) • Voice — type pairing personality (Display / Editorial / Brutal) • Density — spacing scale + tracking (Tight / Studio / Roomy) Values are written to data-* attributes on ; the heavy lifting lives in tweaks.css so every component re-themes without touching its own JSX. */ const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{ "mood": "acid", "voice": "display", "density": "studio" }/*EDITMODE-END*/; function PrimeTweaks() { const [t, setTweak] = window.useTweaks(TWEAK_DEFAULTS); React.useEffect(() => { const root = document.documentElement; root.setAttribute('data-mood', t.mood); root.setAttribute('data-voice', t.voice); root.setAttribute('data-density', t.density); }, [t.mood, t.voice, t.density]); const { TweaksPanel, TweakSection, TweakRadio } = window; return ( setTweak('mood', v)} /> setTweak('voice', v)} /> setTweak('density', v)} /> ); } window.PrimeTweaks = PrimeTweaks;