diff --git a/Draw Steel/draw-steel.html b/Draw Steel/draw-steel.html
index e3324bdd55..31a773be01 100644
--- a/Draw Steel/draw-steel.html	
+++ b/Draw Steel/draw-steel.html	
@@ -356,39 +356,42 @@
 		<div class="sheet-panel-box class-panel">
 			<h5 class="panel-title" data-i18n="class-features"></h5>
 			<fieldset class="repeating_classfeatures">
-				<details class="feature-accordion">
-					<summary>
-						<div class="class-feature-header">
-							<button class="feature-button" type="action" data-i18n-title="feature-share" name="act_classfeatureshare">
-								<!-- speech balloon -->
-								&#128172;
-							</button>
-							<label><span name="attr_classfeature_name"></span>:</label>
-							<span name="attr_classfeature_description"></span>
-						</div>
-					</summary>
+				<input class="ability-edit" type="checkbox" id="ability-edit" />
+				<div class="feature-accordion card-edit">
 					<input type="text" name="attr_classfeature_name" />
 					<textarea name="attr_classfeature_description"></textarea>
-				</details>
+				</div>
+				<div class="feature-accordion">
+					<div class="class-feature-header">
+						<button class="feature-button" type="action" data-i18n-title="feature-share" name="act_classfeatureshare">
+							<!-- speech balloon -->
+							&#128172;
+						</button>
+						<label><span name="attr_classfeature_name"></span>:</label>
+						<span name="attr_classfeature_description"></span>
+					</div>
+				</div>
 			</fieldset>
 		</div>
 		<!-- Ancestry Features Panel -->
 		<div class="sheet-panel-box ancestry-panel">
 			<h5 class="panel-title" data-i18n="ancestry-traits"></h5>
 			<fieldset class="repeating_ancestrytraits">
-				<details class="feature-accordion">
-					<summary>
-						<div class="anc-feature-header">
-							<button class="feature-button" type="action" data-i18n-title="feature-share" name="act_ancfeatureshare">
-								<!-- speech balloon -->
-								&#128172;
-							</button>
-							<label><span name="attr_ancestrytrait_name"></span>:</label>
-							<span name="attr_ancestrytrait_description"></span>
-						</div>
-					</summary>
+				<input class="ability-edit" type="checkbox" id="ability-edit" />
+				<div class="feature-accordion card-edit">
 					<input type="text" name="attr_ancestrytrait_name" />
 					<textarea name="attr_ancestrytrait_description"></textarea>
+				</div>
+				<div class="feature-accordion">
+					<div class="anc-feature-header">
+						<button class="feature-button" type="action" data-i18n-title="feature-share" name="act_ancfeatureshare">
+							<!-- speech balloon -->
+							&#128172;
+						</button>
+						<label><span name="attr_ancestrytrait_name"></span>:</label>
+						<span name="attr_ancestrytrait_description"></span>
+					</div>
+				</div>
 			</fieldset>
 		</div>
 		<!-- Modifiers Panel -->
@@ -467,40 +470,42 @@
 		<div class="sheet-panel-box perks-panel">
 			<h5 class="panel-title" data-i18n="perks"></h5>
 			<fieldset class="repeating_perks">
-				<details class="feature-accordion">
-					<summary>
-						<div class="perk-feature-header">
-							<button class="feature-button" type="action" data-i18n-title="feature-share" name="act_perkfeatureshare">
-								<!-- speech balloon -->
-								&#128172;
-							</button>
-							<label><span name="attr_perk_name"></span>:</label>
-							<span name="attr_perk_description"></span>
-						</div>
-					</summary>
+				<input class="ability-edit" type="checkbox" id="ability-edit" />
+				<div class="feature-accordion card-edit">
 					<input type="text" name="attr_perk_name" />
 					<textarea name="attr_perk_description"></textarea>
-				</details>
+				</div>
+				<div class="feature-accordion">
+					<div class="perk-feature-header">
+						<button class="feature-button" type="action" data-i18n-title="feature-share" name="act_perkfeatureshare">
+							<!-- speech balloon -->
+							&#128172;
+						</button>
+						<label><span name="attr_perk_name"></span>:</label>
+						<span name="attr_perk_description"></span>
+					</div>
+				</div>
 			</fieldset>
 		</div>
 		<!-- Titles Panel -->
 		<div class="sheet-panel-box titles-panel">
 			<h5 class="panel-title" data-i18n="titles"></h5>
 			<fieldset class="repeating_titles">
-				<details class="feature-accordion">
-					<summary>
-						<div class="title-feature-header">
-							<button class="feature-button" type="action" data-i18n-title="feature-share" name="act_titlefeatureshare">
-								<!-- speech balloon -->
-								&#128172;
-							</button>
-							<label><span name="attr_title_name"></span>:</label>
-							<span name="attr_title_description"></span>
-						</div>
-					</summary>
+				<input class="ability-edit" type="checkbox" id="ability-edit" />
+				<div class="feature-accordion card-edit">
 					<input type="text" name="attr_title_name" />
 					<textarea name="attr_title_description"></textarea>
-				</details>
+				</div>
+				<div class="feature-accordion">
+					<div class="title-feature-header">
+						<button class="feature-button" type="action" data-i18n-title="feature-share" name="act_titlefeatureshare">
+							<!-- speech balloon -->
+							&#128172;
+						</button>
+						<label><span name="attr_title_name"></span>:</label>
+						<span name="attr_title_description"></span>
+					</div>
+				</div>
 			</fieldset>
 		</div>
 	</div>