diff --git a/core/wiki/peek-stylesheets.tid b/core/wiki/peek-stylesheets.tid
index 7d9726fbe..6f364de77 100644
--- a/core/wiki/peek-stylesheets.tid
+++ b/core/wiki/peek-stylesheets.tid
@@ -1,35 +1,28 @@
 title: $:/snippets/peek-stylesheets
 
-\define expandable-stylesheets-list()
+\procedure expandable-stylesheets-list()
 \whitespace trim
 <ol>
 <$list filter="[all[shadows+tiddlers]tag[$:/tags/Stylesheet]!has[draft.of]]">
-<$vars state=<<qualify "$:/state/peek-stylesheets/open/">>>
-<$set name="state" value={{{ [<state>addsuffix<currentTiddler>] }}}>
+<$let openState=`$:/state/peek-tiddler/open/$(currentTiddler)$$(qualify)$` open={{{ [<openState>get[text]else[no]] }}}>
 <li>
-<$reveal type="match" state=<<state>> text="yes" tag="span">
-<$button set=<<state>> setTo="no" class="tc-btn-invisible">
-{{$:/core/images/down-arrow}}
-</$button>
-</$reveal>
-<$reveal type="nomatch" state=<<state>> text="yes" tag="span">
-<$button set=<<state>> setTo="yes" class="tc-btn-invisible">
-{{$:/core/images/right-arrow}}
-</$button>
-</$reveal>
-<$link>
-<$view field="title"/>
-</$link>
-<$reveal type="match" state=<<state>> text="yes" tag="div">
-<$set name="source" tiddler=<<currentTiddler>>>
-<$wikify name="styles" text=<<source>>>
+<$checkbox tiddler=<<openState>> field="text" checked="yes" style.appearance="none">
+<span style.cursor="pointer">
+<%if [<open>match[yes]]%>
+{{$:/core/images/down-arrow|1em}}
+<%else%>
+{{$:/core/images/right-arrow|1em}}
+<%endif%>
+</span>
+</$checkbox>
+<$link/>
+<%if [<open>match[yes]]%>
+<$wikify name="styles" text={{!!text}}>
 <$codeblock code=<<styles>> language="css"/>
 </$wikify>
-</$set>
-</$reveal>
+<%endif%>
 </li>
-</$set>
-</$vars>
+</$let>
 </$list>
 </ol>
 \end
@@ -39,38 +32,36 @@ title: $:/snippets/peek-stylesheets
 <ol>
 <$list filter="[all[shadows+tiddlers]tag[$:/tags/Stylesheet]!has[draft.of]]">
 <li>
-<$link>
-<$view field="title"/>
-</$link>
-<$set name="source" tiddler=<<currentTiddler>>>
-<$wikify name="styles" text=<<source>>>
+<$link/>
+<$wikify name="styles" text={{!!text}}>
 <pre>
 <code>
 <$text text=<<styles>>/>
 </code>
 </pre>
 </$wikify>
-</$set>
 </li>
 </$list>
 </ol>
 \end
 \whitespace trim
 
-<$vars modeState=<<qualify "$:/state/peek-stylesheets/mode/">>>
+<$let modeState=`$:/state/peek-stylesheets/mode/$(qualify)$` mode={{{ [<modeState>get[text]else[expand]] }}}>
 
-<$reveal type="nomatch" state=<<modeState>> text="expanded" tag="div">
-<$button set=<<modeState>> setTo="expanded" class="tc-btn-invisible">{{$:/core/images/chevron-right}} {{$:/language/ControlPanel/Stylesheets/Expand/Caption}}</$button>
-</$reveal>
-<$reveal type="match" state=<<modeState>> text="expanded" tag="div">
-<$button set=<<modeState>> setTo="restored" class="tc-btn-invisible">{{$:/core/images/chevron-down}} {{$:/language/ControlPanel/Stylesheets/Restore/Caption}}</$button>
-</$reveal>
+<$checkbox tiddler=<<modeState>> field="text" checked="yes" style.appearance="none">
+<span style.cursor="pointer">
+<%if [<mode>match[expand]]%>
+{{$:/core/images/chevron-right|1em}} {{$:/language/ControlPanel/Stylesheets/Expand/Caption}}
+<%else%>
+{{$:/core/images/chevron-down|1em}} {{$:/language/ControlPanel/Stylesheets/Restore/Caption}}
+<%endif%>
+</span>
+</$checkbox>
 
-<$reveal type="nomatch" state=<<modeState>> text="expanded" tag="div">
+<%if [<mode>match[expand]]%>
 <<expandable-stylesheets-list>>
-</$reveal>
-<$reveal type="match" state=<<modeState>> text="expanded" tag="div">
+<%else%>
 <<stylesheets-list>>
-</$reveal>
+<%endif%>
 
-</$vars>
+</$let>
\ No newline at end of file