Update app.py

app.py

@@ -873,6 +873,57 @@ custom_css = """
   width: 100% !important;
   box-sizing: border-box !important;
 }
+
+/* ===============================
+   ★追加：Group選択中を確実に見えるように（Edge対応）
+   =============================== */
+
+/* ラジオ自体がOS/ブラウザ依存で薄くなるのを防ぐ */
+#group_radio input[type="radio"]{
+  appearance: auto !important;
+  -webkit-appearance: radio !important;
+  width: 18px !important;
+  height: 18px !important;
+  accent-color: #2563eb !important;
+}
+
+/* 各選択肢を行として見やすく */
+#group_radio label{
+  width: 100% !important;
+  box-sizing: border-box !important;
+  padding: 10px 12px !important;
+  border-radius: 12px !important;
+  border: 1px solid #e5e7eb !important;
+  display: flex !important;
+  align-items: center !important;
+  gap: 10px !important;
+}
+
+/* ✅ checked のとき “行全体” をハイライト
+   （DOM差に備えて :has / input+span / input~span を全部用意）
+*/
+@media (prefers-color-scheme: light){
+  #group_radio label:has(input[type="radio"]:checked){
+    background: #eef2ff !important;
+    border: 2px solid #4f46e5 !important;
+  }
+  #group_radio input[type="radio"]:checked + span,
+  #group_radio input[type="radio"]:checked ~ span{
+    font-weight: 700 !important;
+  }
+}
+
+@media (prefers-color-scheme: dark){
+  #group_radio label:has(input[type="radio"]:checked){
+    background: #1f2937 !important;
+    border: 2px solid #60a5fa !important;
+  }
+  #group_radio input[type="radio"]:checked + span,
+  #group_radio input[type="radio"]:checked ~ span{
+    font-weight: 700 !important;
+  }
+}
+
 """
 
 with gr.Blocks(css=custom_css, js=radio_js) as demo:
@@ -883,9 +934,9 @@ with gr.Blocks(css=custom_css, js=radio_js) as demo:
     student_id_input = gr.Textbox(label="学生番号（必須）")
 
     group_input = gr.Radio(
-        choices=[("Group 1", 1), ("Group 2", 2)],
+        choices=[("Group 1", "1"), ("Group 2", "2")],
         label="実験グループを選択",
-        value=2,
+        value="2",
         elem_id="group_radio"  # ★追加：Edgeでも確実に狙うため
     )