diff --git a/src-ui/css/ui.css b/src-ui/css/ui.css
index d865d864d..4565623c8 100644
--- a/src-ui/css/ui.css
+++ b/src-ui/css/ui.css
@@ -75,9 +75,14 @@ h2#title {
   background: linear-gradient(to bottom, #99334f, #993366);
 }
 
-.btn-warn:active {
-  background: #999900;
-  background: linear-gradient(to bottom, #999900, #cccc00);
+.btn-mono {
+  background: #1d1d1d;
+  background: linear-gradient(to bottom, #b8b8b8, #1d1d1d);
+  color: white;
+}
+.btn-mono:active {
+  background: #0e0e0e;
+  background: linear-gradient(to bottom, #0e0e0e, #1d1d1d);
 }
 
 .btn-danger {
diff --git a/src-ui/js/ui/ToolArea.js b/src-ui/js/ui/ToolArea.js
index 6802469d7..51ae01763 100644
--- a/src-ui/js/ui/ToolArea.js
+++ b/src-ui/js/ui/ToolArea.js
@@ -158,6 +158,7 @@ ui.toolarea = {
 				: "none";
 		this.setdisplay("trialmode");
 		this.setdisplay("network");
+		this.setdisplay("autocheck_mode");
 
 		/* 共通：キャプションの設定 */
 		/* --------------------- */
@@ -208,6 +209,33 @@ ui.toolarea = {
 			}
 			getEL("btncheck").textContent = str;
 		}
+		if (idname === "autocheck_mode") {
+			var checkMode = ui.menuconfig.get("autocheck_mode");
+
+			if (!ui.puzzle.playeronly) {
+				checkMode = "off";
+			} else if (
+				checkMode === "guarded" &&
+				!ui.puzzle.checker.supportsGuarded
+			) {
+				checkMode = "simple";
+			}
+
+			var classes = getEL("btncheck").classList;
+			classes.remove("btn-ok", "btn-mono", "btn-info");
+
+			switch (checkMode) {
+				case "guarded":
+					classes.add("btn-info");
+					break;
+				case "simple":
+					classes.add("btn-ok");
+					break;
+				case "off":
+					classes.add("btn-mono");
+					break;
+			}
+		}
 
 		var trial = ui.puzzle.board.trialstage > 0;
 		var net = ui.network.mode !== "";
diff --git a/src-ui/p.html b/src-ui/p.html
index ae6113e8e..56f285fc0 100644
--- a/src-ui/p.html
+++ b/src-ui/p.html
@@ -407,7 +407,7 @@ <h2 id="title2">読み込み中です...</h2>
 </div>
 
 <div id="btnarea" class="outofboard" style="display:none;"> <!-- Buttons below board下部のボタン -->
-  <button type="button" class="btn btn-ok" id="btncheck" data-button-exec="answercheck">__check__</button>
+  <button type="button" class="btn" id="btncheck" data-button-exec="answercheck">__check__</button>
   <button type="button" class="btn" id="btnundo"    data-press-exec="undo,undostop">__undo__</button
  ><button type="button" class="btn" id="btnredo"    data-press-exec="redo,redostop">__redo__</button>
   <button type="button" class="btn" id="btnclear"   data-button-exec="ansclear">__ansclear__</button
diff --git a/src/puzzle/Answer.js b/src/puzzle/Answer.js
index 4fd704edb..9682e75b1 100644
--- a/src/puzzle/Answer.js
+++ b/src/puzzle/Answer.js
@@ -18,6 +18,7 @@ pzpr.classmgr.makeCommon({
 		failcodemode: void 0,
 		failcode: void 0,
 		_info: void 0,
+		supportsGuarded: false,
 		checklist: [],
 
 		//---------------------------------------------------------------------------
@@ -31,6 +32,9 @@ pzpr.classmgr.makeCommon({
 				var item = checklist[i],
 					isexist = true,
 					prio = 0;
+				if (item.startsWith("done")) {
+					this.supportsGuarded = true;
+				}
 				if (item.match("@")) {
 					isexist = pzpr.util.checkpid(
 						item.substr(item.indexOf("@") + 1),