第 1 阶段：虚拟实训台，项目 2、3 的示例跑通

- 实训台状态由服务器统一保存：滑块和开关设定传感器读数，推给学生程序；
  学生程序控制的灯、继电器、LED 屏回写到实训台
- 网页按教材实训台布局图绘制实训台，传感器卡片上直接调节环境
- 新控件：CheckBox、RadioButton（事件顺序与 WinForms 一致），Lamp、Alarm
- 设备类库：串口未打开时控制无效，与实物一致
- 修正：列表属性序列化时数字被转成字符串
- 示例：项目 2 任务 2–3、项目 3 任务 1–2；网址参数 ?sample= 打开指定示例
- 测试：实训台单元测试，项目 2、3 的端到端测试

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

web/src/winforms/winforms.css

@@ -151,6 +151,55 @@
   color: #fff;
 }
 
+.wf-check {
+  display: flex;
+  align-items: center;
+  gap: 3px;
+  white-space: pre;
+  cursor: default;
+}
+
+.wf-checkbox-box,
+.wf-radio-dot {
+  flex: none;
+  width: 13px;
+  height: 13px;
+  box-sizing: border-box;
+  border: 1px solid #333;
+  background: #fff;
+}
+
+.wf-radio-dot {
+  border-radius: 50%;
+}
+
+.wf-checkbox-box[data-checked="true"]::after {
+  content: "✓";
+  display: block;
+  font: bold 11px/11px sans-serif;
+  text-align: center;
+  color: #333;
+}
+
+.wf-radio-dot[data-checked="true"] {
+  background: radial-gradient(circle, #333 0 3px, #fff 3.5px);
+}
+
+.wf-check:hover:not(.wf-disabled) .wf-checkbox-box,
+.wf-check:hover:not(.wf-disabled) .wf-radio-dot {
+  border-color: #0078d7;
+}
+
+.wf-device-image {
+  overflow: hidden;
+}
+
+/* 与教材控件一致：图片以原始尺寸从左上角显示 */
+.wf-device-image img {
+  display: block;
+  user-select: none;
+}
+
 .wf-groupbox-frame {
   position: absolute;
   inset: 6px 0 0 0;