Yoosful Game [2021] May 2026

/* right: tool deck */ .tools-column { flex: 1; min-width: 280px; background: #e7dcc8; border-radius: 48px; padding: 18px 16px; box-shadow: inset 0 0 0 2px #fff3e0, 0 10px 20px rgba(0,0,0,0.1); }

.reset-btn { background: #4a5b6e; box-shadow: 0 6px 0 #2c3a47; }

function removeWinModal() { const existing = document.getElementById('winModal'); if (existing) existing.remove(); } yoosful game

function selectTask(taskId) { const taskExists = currentTasks.some(t => t.id === taskId); if (!taskExists) { setMessage("❌ This task is already completed!", true); selectedTaskId = null; renderTasks(); return; } selectedTaskId = taskId; renderTasks(); setMessage(`🔍 Selected: "${currentTasks.find(t => t.id === taskId)?.name}". Now pick a tool!`); }

/* stats row */ .stats-row { display: flex; justify-content: space-between; margin: 20px 8px 18px 8px; font-weight: 600; background: #e9dbc7; padding: 10px 20px; border-radius: 48px; } /* right: tool deck */

.tools-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 16px; margin-top: 10px; }

<script> // ---------- YOOSFUL GAME DATA ---------- // Each task has a unique id, name, emoji, and required tool name (key) const TASKS = [ { id: 0, name: "Loosen rusty bolt", emoji: "🔩", requiredTool: "wrench", description: "needs grip & torque" }, { id: 1, name: "Hang a picture frame", emoji: "🖼️", requiredTool: "hammer", description: "nail it gently" }, { id: 2, name: "Measure window width", emoji: "📏", requiredTool: "tape measure", description: "accurate length" }, { id: 3, name: "Cut a cardboard box", emoji: "📦", requiredTool: "scissors", description: "clean cut" }, { id: 4, name: "Tighten loose screw", emoji: "🧰", requiredTool: "screwdriver", description: "cross or flat" }, { id: 5, name: "Level a shelf", emoji: "📐", requiredTool: "level", description: "bubble leveling" }, { id: 6, name: "Paint a wall patch", emoji: "🎨", requiredTool: "paintbrush", description: "smooth stroke" }, { id: 7, name: "Cut a wire", emoji: "⚡", requiredTool: "pliers", description: "strip & snip" } ]; padding: 18px 16px

// event binding and init function initGame() { resetGame(); // additional event listeners resetBtn.addEventListener('click', () => { removeWinModal(); resetGame(); }); skipHintBtn.addEventListener('click', () => { randomHint(); }); // close win modal if clicked outside? handled by new game button inside } // final start initGame(); </script> </body> </html>