Move 3 Strikes from Admin to Dashboard, add strikes feature

- Adds strikes (0-3) to Child model with migration
- New PATCH /api/children/{id}/strikes endpoint with WebSocket broadcast
- TV dashboard shows red ✕ marks next to child name when strikes > 0
- 3 Strikes card on Dashboard page (removed from Admin)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

frontend/src/views/DashboardView.vue

@@ -79,6 +79,28 @@
           </div>
         </div>
 
+        <!-- 3 Strikes -->
+        <div class="card strikes-card">
+          <div class="card-title">3 Strikes</div>
+          <div class="strikes-list">
+            <div v-for="child in childrenStore.children" :key="child.id" class="strikes-row">
+              <div class="strikes-child-color" :style="{ background: child.color }"></div>
+              <span class="strikes-child-name">{{ child.name }}</span>
+              <div class="strikes-buttons">
+                <button
+                  v-for="i in 3"
+                  :key="i"
+                  class="strike-btn"
+                  :class="{ lit: i <= child.strikes }"
+                  @click="toggleStrike(child, i)"
+                  :title="`Strike ${i}`"
+                >✕</button>
+              </div>
+            </div>
+            <div v-if="childrenStore.children.length === 0" class="empty-small">No children added yet.</div>
+          </div>
+        </div>
+
         <!-- TV Link -->
         <div class="card tv-card">
           <div class="card-title">TV Dashboard</div>
@@ -183,6 +205,13 @@ async function startSession() {
   await loadDashboard()
 }
 
+async function toggleStrike(child, index) {
+  const newStrikes = index <= child.strikes ? index - 1 : index
+  const res = await api.patch(`/api/children/${child.id}/strikes`, { strikes: newStrikes })
+  const idx = childrenStore.children.findIndex((c) => c.id === child.id)
+  if (idx !== -1) childrenStore.children[idx] = res.data
+}
+
 async function sendAction(type) {
   if (!scheduleStore.session) return
   await scheduleStore.sendTimerAction(scheduleStore.session.id, type)
@@ -288,6 +317,45 @@ h1 { font-size: 1.75rem; font-weight: 700; }
 
 .block-list { display: flex; flex-direction: column; gap: 0.5rem; }
 
+.strikes-card { grid-column: span 1; }
+
+.strikes-list { display: flex; flex-direction: column; gap: 0.6rem; }
+
+.strikes-row {
+  display: flex;
+  align-items: center;
+  gap: 0.75rem;
+}
+
+.strikes-child-color { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
+.strikes-child-name { flex: 1; font-size: 0.95rem; }
+
+.strikes-buttons { display: flex; gap: 0.5rem; }
+
+.strike-btn {
+  width: 2.25rem;
+  height: 2.25rem;
+  border-radius: 50%;
+  border: 2px solid #334155;
+  background: transparent;
+  color: #334155;
+  font-size: 1rem;
+  font-weight: 700;
+  cursor: pointer;
+  transition: all 0.15s;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.strike-btn:hover { border-color: #ef4444; color: #ef4444; }
+
+.strike-btn.lit {
+  background: #7f1d1d;
+  border-color: #ef4444;
+  color: #fca5a5;
+}
+
 .tv-card { grid-column: span 1; }
 .tv-desc { color: #64748b; margin-bottom: 1rem; font-size: 0.9rem; }