Here's a general method I've used for toggling between styles, based on a single checkbox control:
1) Let's assume the two stylesheet tiddlers are named [[EditorStylesheet]] and [[PublishedStylesheet]]
2) Remove the $:/tags/Stylesheet tag from *both* of those stylesheet tiddlers.
3) Create a tiddler, [[CommonStylesheet]], tagged with "$:/tags/Stylesheet", containing:
<$reveal state="$:/state/allowedit" type="match" text="">
{{PublishedStylesheet}}
</$reveal>
<$reveal state="$:/state/allowedit" type="nomatch" text="">
{{EditorStylesheet}}
</$reveal>
4) Place the following checkbox control anywhere you like:
<$checkbox tiddler="$:/state/allowedit" field="text"
checked="yes" unchecked="" default="">
allow editing
</$checkbox>
The checkbox toggles a $:/state value between "" and "yes" to control which styles are transcluded in the [[CommonStylesheet]].
Note: [[CommonStylesheet]] could also contain other "common" CSS directives that are shared between both Editor and Published styles, thus allowing those "stylesheets" to contain only the differences between the two modes of viewing.
enjoy,
-e
Eric Shulman
TiddlyTools: Small Tools for Big Ideas (tm)
InsideTiddlyWiki: The Missing Manuals