@onnie81/murdoku-spor 1.0.0

package/.dockerignore

@@ -0,0 +1,7 @@
+node_modules
+client/node_modules
+server/public
+data
+.git
+*.log
+tests/artifacts

package/Dockerfile

@@ -0,0 +1,40 @@
+# ---------- build stage ----------
+FROM node:22-bookworm-slim AS build
+WORKDIR /app
+
+# toolchain fallback in case a native module has no prebuilt binary
+RUN apt-get update \
+ && apt-get install -y --no-install-recommends python3 make g++ \
+ && rm -rf /var/lib/apt/lists/*
+
+COPY package.json ./
+COPY client/package.json ./client/
+RUN npm install --no-audit --no-fund && npm --prefix client install --no-audit --no-fund
+
+COPY shared ./shared
+COPY server ./server
+COPY client ./client
+RUN npm --prefix client run build \
+ && npm prune --omit=dev
+
+# ---------- runtime stage ----------
+FROM node:22-bookworm-slim
+ENV NODE_ENV=production \
+    PORT=8080 \
+    DATA_DIR=/data
+WORKDIR /app
+
+COPY --from=build /app/package.json ./
+COPY --from=build /app/node_modules ./node_modules
+COPY --from=build /app/shared ./shared
+COPY --from=build /app/server ./server
+
+RUN mkdir -p /data && chown -R node:node /data /app
+USER node
+VOLUME /data
+EXPOSE 8080
+
+HEALTHCHECK --interval=30s --timeout=5s --start-period=20s --retries=3 \
+  CMD node -e "fetch('http://127.0.0.1:'+(process.env.PORT||8080)+'/api/health').then(r=>process.exit(r.ok?0:1)).catch(()=>process.exit(1))"
+
+CMD ["node", "server/index.js"]

package/README.md

@@ -0,0 +1,125 @@
+# Murdoku
+
+A complete online murder-mystery placement-deduction game — the pencil-and-paper
+"Murdoku" genre (Cluedo × Sudoku), fully procedural and multiplayer-social.
+
+A victim and a cast of suspects must be placed on an illustrated crime scene:
+**each row and each column holds exactly one person**, furniture blocks squares,
+rooms and testimonies constrain everyone — and whoever ends up **alone with the
+victim** is the killer.
+
+## Features
+
+- **Procedural cases** — every board is generated: room layout, furniture,
+  ground truth, and a minimal clue set proven to have a **unique solution** that
+  is **solvable without blind guessing** (propagation + single-assumption logic).
+- **5 difficulties** — Beginner 5×5 → Expert 9×9, graded by the number of
+  assumption rounds a logical solver needs, not just clue count.
+- **Daily challenges** — same five seeded cases for the whole world (UTC),
+  with global and friends leaderboards, streaks, and a case archive.
+- **Full play kit** — tap or drag placement, legal-move highlighting with
+  automatic graying of non-allowed squares, X marks, pencil marks (small
+  numbers or mini faces), clue spotlighting + strike-through, undo/redo,
+  hints, pause, mistake tracking, three assist levels.
+- **Accounts, sessions, friends** — instant guest play (per-device session),
+  optional username+password accounts that adopt the guest history, friend
+  requests, and daily leaderboards. SQLite storage, one file.
+- **History tracker** — per-user record: solved/played, streaks, best and
+  average times per difficulty, full case log; autosave + resume on any device.
+- **Responsive + touch** — phone, tablet, desktop; pointer-based drag & drop,
+  long-press to mark X, keyboard shortcuts (1-9, N, X, U, R, E).
+- **Multilingual** — English and Spanish shipped; clues are structured data
+  rendered through per-language templates, so adding a language is one file.
+- **Original art** — 12 hand-drawn SVG suspect portraits, 16 furniture icons,
+  8 scene themes, logo — no external assets, no fonts to load.
+
+## Quick start (Docker)
+
+```bash
+docker compose up -d --build
+# open http://localhost:8080
+```
+
+Data (users, games, puzzles) lives in the `murdoku-data` volume as a single
+SQLite file. Back it up with:
+
+```bash
+docker run --rm -v murdoku-data:/data -v "$PWD:/out" debian \
+  cp /data/murdoku.db /out/murdoku-backup.db
+```
+
+### HTTPS / domain
+
+Uncomment the `caddy` service in `docker-compose.yml`, set your domain, remove
+the direct port mapping, and `docker compose up -d`. Caddy provisions TLS
+automatically. (Any reverse proxy works; the app sets `trust proxy`.)
+
+### Configuration
+
+| Env | Default | Meaning |
+|---|---|---|
+| `PORT` | `8080` | HTTP port |
+| `DATA_DIR` | `/data` (container) / `./data` (bare) | SQLite location |
+
+## Development
+
+```bash
+npm install && npm --prefix client install
+npm run build        # vite build -> server/public
+npm run dev          # serve on :8080
+npm test             # engine + API integration tests
+node tests/e2e.mjs   # Playwright visual/interaction smoke (needs chromium)
+```
+
+Dev loop with hot reload: `npm run dev` in one terminal,
+`npm --prefix client run dev` in another (Vite on :5173 proxies `/api`).
+
+## Architecture
+
+```
+shared/    puzzle engine (isomorphic, seeded & deterministic)
+  rng.js         xmur3 + mulberry32 seeded RNG
+  model.js       cast, themes, difficulty bands, clue-type sets
+  clues.js       scene context + bitmask tables, predicates, clue-pool gen
+  bits.js        96-bit bitset primitives
+  solver.js      CSP: propagation (singles, arc revision, hidden singles,
+                 room counts), uniqueness counting, "what-if" logical solver
+  generator.js   rooms → furniture → ground truth (victim alone with exactly
+                 one person) → clue selection/minimization → difficulty grading
+server/    Express + better-sqlite3
+  db.js          schema + queries (users, sessions, puzzles, games, friendships)
+  auth.js        cookie sessions, bcrypt accounts, guest→account merge
+  puzzles.js     daily seeding (UTC), free-play pregeneration pool
+  api.js         REST: auth, settings, daily, games, history, stats,
+                 friends, leaderboards
+client/    React + Vite single-page app
+  game.js        per-game store: placement, legality, notes, X, undo/redo,
+                 autosave, accusation flow
+  components/    Board (SVG scene), Tray, CluePanel, Play/Home/Daily/
+                 History/Friends/Settings views
+  i18n/          en/es dictionaries + structured clue renderer
+  art/           original SVG portraits, furniture, logo
+```
+
+The daily seed is `daily:<UTC date>`; generation is fully deterministic, and
+generated dailies are persisted, so every player gets the identical case.
+
+**Honesty model:** the solution ships to the client to power instant assists
+(wrong-placement flags, accusation feedback). Finishing is validated
+server-side against the stored solution, but a determined user could read the
+solution from devtools — fine for a friendly game, worth knowing for prizes.
+
+## Adding a language
+
+Copy `client/src/i18n/en.js` to e.g. `fr.js`, translate the values (UI strings,
+roles, rooms, objects, scenes, clue templates), and register it in
+`client/src/i18n/index.js` (`DICTS`, `LANGS`). Rooms/objects carry `n` (label)
+and `p` (in-sentence with article) forms so grammar stays natural.
+
+## Originality
+
+Game mechanics follow the published Murdoku puzzle genre by Manuel Garand
+(one person per row/column, map evidence, the murderer alone with the victim).
+All code, characters, scenes, artwork, and text in this project are original.
+"Murdoku" as a public-facing name/brand belongs to its owners — for a public
+commercial deployment, consider your own title.

package/client/index.html

@@ -0,0 +1,16 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
+    <meta name="theme-color" content="#14121d" />
+    <meta name="description" content="Murdoku — murder-mystery placement puzzles. One person per row and column. Find who was alone with the victim." />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <link rel="manifest" href="/manifest.webmanifest" />
+    <title>Murdoku</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.jsx"></script>
+  </body>
+</html>

package/client/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "murdoku-client",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build"
+  },
+  "dependencies": {
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-react": "^4.3.1",
+    "vite": "^5.4.0"
+  }
+}

package/client/public/favicon.svg

@@ -0,0 +1,14 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
+  <rect width="100" height="100" rx="20" fill="#14121d"/>
+  <rect x="14" y="14" width="56" height="56" rx="8" fill="#2b2440" stroke="#c9a227" stroke-width="4"/>
+  <g stroke="#c9a227" stroke-width="3" opacity="0.75">
+    <line x1="33" y1="16" x2="33" y2="68"/>
+    <line x1="51" y1="16" x2="51" y2="68"/>
+    <line x1="16" y1="33" x2="68" y2="33"/>
+    <line x1="16" y1="51" x2="68" y2="51"/>
+  </g>
+  <circle cx="42" cy="42" r="24" fill="#00000066" stroke="#efe6d0" stroke-width="6.5"/>
+  <path d="M60,62 L84,88" stroke="#efe6d0" stroke-width="10" stroke-linecap="round"/>
+  <path d="M60,62 L84,88" stroke="#8d1d2c" stroke-width="4.5" stroke-linecap="round"/>
+  <path d="M34,34 L50,50 M50,34 L34,50" stroke="#e5484d" stroke-width="5.5" stroke-linecap="round"/>
+</svg>

package/client/public/manifest.webmanifest

@@ -0,0 +1,12 @@
+{
+  "name": "Murdoku",
+  "short_name": "Murdoku",
+  "description": "Murder-mystery placement puzzles. One person per row and column — find who was alone with the victim.",
+  "start_url": "/",
+  "display": "standalone",
+  "background_color": "#14121d",
+  "theme_color": "#14121d",
+  "icons": [
+    { "src": "/favicon.svg", "sizes": "any", "type": "image/svg+xml", "purpose": "any" }
+  ]
+}

package/client/src/App.jsx

@@ -0,0 +1,62 @@
+import React, { useEffect, useSyncExternalStore } from 'react';
+import { useApp, initApp, navigate } from './store.js';
+import { onLangChange, getLang, t } from './i18n/index.js';
+import { HomeView } from './components/HomeView.jsx';
+import { PlayView } from './components/PlayView.jsx';
+import { DailyView } from './components/DailyView.jsx';
+import { HistoryView } from './components/HistoryView.jsx';
+import { FriendsView } from './components/FriendsView.jsx';
+import { SettingsView } from './components/SettingsView.jsx';
+import { GlassMark } from './art/logo.jsx';
+
+function useLang() {
+  return useSyncExternalStore(onLangChange, getLang);
+}
+
+const NAV = [
+  ['#/', 'home', '⌂'],
+  ['#/daily', 'daily', '☀'],
+  ['#/history', 'history', '▤'],
+  ['#/friends', 'friends', '☺'],
+  ['#/settings', 'settings', '⚙']
+];
+
+export default function App() {
+  const app = useApp();
+  const lang = useLang();
+
+  useEffect(() => { initApp(); }, []);
+
+  if (!app.ready) return <div className="boot"><GlassMark size={64} /></div>;
+
+  const { route } = app;
+  const inPlay = route.view === 'play';
+
+  return (
+    <div className={`app${inPlay ? ' app-play' : ''}`} key={lang}>
+      <main className="main">
+        {route.view === 'home' && <HomeView />}
+        {route.view === 'play' && <PlayView gameId={route.gameId} />}
+        {route.view === 'daily' && <DailyView />}
+        {route.view === 'history' && <HistoryView />}
+        {route.view === 'friends' && <FriendsView />}
+        {route.view === 'settings' && <SettingsView />}
+      </main>
+
+      {!inPlay && (
+        <nav className="nav">
+          {NAV.map(([hash, key, icon]) => (
+            <button key={key}
+              className={route.view === key || (key === 'home' && route.view === 'home') ? 'on' : ''}
+              onClick={() => navigate(hash)}>
+              <i aria-hidden>{icon}</i>
+              <span>{t(key)}</span>
+            </button>
+          ))}
+        </nav>
+      )}
+
+      {app.toast && <div className="toast" role="status">{app.toast}</div>}
+    </div>
+  );
+}

package/client/src/api.js

@@ -0,0 +1,40 @@
+async function req(path, opts = {}) {
+  const res = await fetch('/api' + path, {
+    method: opts.method || 'GET',
+    headers: opts.body != null ? { 'content-type': 'application/json' } : undefined,
+    body: opts.body != null ? JSON.stringify(opts.body) : undefined,
+    credentials: 'same-origin',
+    keepalive: !!opts.keepalive
+  });
+  let body = null;
+  try { body = await res.json(); } catch { /* empty */ }
+  if (!res.ok) {
+    const err = new Error(body?.error || `http_${res.status}`);
+    err.status = res.status;
+    err.code = body?.error;
+    throw err;
+  }
+  return body;
+}
+
+export const api = {
+  me: () => req('/me'),
+  register: (username, password) => req('/auth/register', { method: 'POST', body: { username, password } }),
+  login: (username, password) => req('/auth/login', { method: 'POST', body: { username, password } }),
+  logout: () => req('/auth/logout', { method: 'POST' }),
+  saveSettings: (settings) => req('/settings', { method: 'PUT', body: settings }),
+  daily: (date) => req('/daily' + (date ? `?date=${date}` : '')),
+  newGame: (mode, difficulty, date) => req('/games', { method: 'POST', body: { mode, difficulty, date } }),
+  getGame: (id) => req(`/games/${id}`),
+  saveGame: (id, payload, keepalive = false) => req(`/games/${id}`, { method: 'PUT', body: payload, keepalive }),
+  finishGame: (id, payload) => req(`/games/${id}/finish`, { method: 'POST', body: payload }),
+  abandonGame: (id) => req(`/games/${id}/abandon`, { method: 'POST' }),
+  active: () => req('/active'),
+  history: (limit = 60, offset = 0) => req(`/history?limit=${limit}&offset=${offset}`),
+  stats: () => req('/stats'),
+  friends: () => req('/friends'),
+  friendRequest: (username) => req('/friends/request', { method: 'POST', body: { username } }),
+  friendRespond: (userId, accept) => req('/friends/respond', { method: 'POST', body: { userId, accept } }),
+  friendRemove: (userId) => req(`/friends/${userId}`, { method: 'DELETE' }),
+  leaderboard: (date, difficulty, scope) => req(`/leaderboard?date=${date}&difficulty=${difficulty}&scope=${scope}`)
+};

package/client/src/art/logo.jsx

@@ -0,0 +1,29 @@
+import React from 'react';
+
+export function Wordmark({ size = 1 }) {
+  return (
+    <div className="wordmark" style={{ fontSize: `${size}em` }}>
+      <GlassMark />
+      <span className="wordmark-text">MURDOKU</span>
+    </div>
+  );
+}
+
+export function GlassMark({ size = 44 }) {
+  return (
+    <svg viewBox="0 0 100 100" width={size} height={size} className="glassmark" role="img" aria-label="Murdoku">
+      <rect x="8" y="8" width="60" height="60" rx="10" fill="#2b2440" stroke="#c9a227" strokeWidth="4" />
+      <g stroke="#c9a227" strokeWidth="3" opacity="0.75">
+        <line x1="28" y1="10" x2="28" y2="66" />
+        <line x1="48" y1="10" x2="48" y2="66" />
+        <line x1="10" y1="28" x2="66" y2="28" />
+        <line x1="10" y1="48" x2="66" y2="48" />
+      </g>
+      <circle cx="38" cy="38" r="26" fill="#00000055" stroke="#efe6d0" strokeWidth="7" />
+      <circle cx="38" cy="38" r="26" fill="none" stroke="#c9a227" strokeWidth="2.5" />
+      <path d="M57,60 L82,86" stroke="#efe6d0" strokeWidth="11" strokeLinecap="round" />
+      <path d="M57,60 L82,86" stroke="#8d1d2c" strokeWidth="5" strokeLinecap="round" />
+      <path d="M30,30 L46,46 M46,30 L30,46" stroke="#e5484d" strokeWidth="6" strokeLinecap="round" />
+    </svg>
+  );
+}

package/client/src/art/objects.jsx

@@ -0,0 +1,158 @@
+// Original furniture / object icons, drawn to sit inside a board cell.
+import React from 'react';
+
+const S = { fill: 'none', stroke: 'currentColor', strokeWidth: 5, strokeLinecap: 'round', strokeLinejoin: 'round' };
+const F = { fill: 'currentColor', stroke: 'none' };
+
+const ICONS = {
+  piano: (
+    <>
+      <path {...F} d="M18,30 L66,30 Q84,34 84,52 Q84,70 62,70 L18,70 Z" opacity="0.85" />
+      <rect {...F} x="18" y="30" width="10" height="40" opacity="0.5" />
+      <path {...S} strokeWidth="3" d="M28,36 L28,64" opacity="0.6" />
+      <path {...F} d="M18,74 L60,74 L60,80 L18,80 Z" opacity="0.5" />
+    </>
+  ),
+  armchair: (
+    <>
+      <path {...F} d="M26,34 Q50,24 74,34 L74,58 L26,58 Z" opacity="0.75" />
+      <rect {...F} x="16" y="46" width="14" height="26" rx="6" opacity="0.9" />
+      <rect {...F} x="70" y="46" width="14" height="26" rx="6" opacity="0.9" />
+      <rect {...F} x="26" y="58" width="48" height="14" rx="4" opacity="0.6" />
+    </>
+  ),
+  bookshelf: (
+    <>
+      <rect {...S} x="24" y="18" width="52" height="64" />
+      <line {...S} strokeWidth="4" x1="24" y1="40" x2="76" y2="40" />
+      <line {...S} strokeWidth="4" x1="24" y1="60" x2="76" y2="60" />
+      {[30, 37, 44, 52, 59, 66].map((x, i) => (
+        <rect key={i} {...F} x={x} y={i % 2 ? 24 : 26} width="5" height={i % 2 ? 13 : 11} opacity="0.7" />
+      ))}
+      {[32, 41, 50, 59, 66].map((x, i) => (
+        <rect key={i} {...F} x={x} y={i % 2 ? 45 : 47} width="5" height={i % 2 ? 12 : 10} opacity="0.55" />
+      ))}
+    </>
+  ),
+  plant: (
+    <>
+      <path {...F} d="M34,62 L66,62 L60,84 L40,84 Z" opacity="0.8" />
+      <path {...S} strokeWidth="4" d="M50,62 L50,42" />
+      <path {...F} d="M50,44 Q34,42 30,26 Q48,28 50,44 Z" opacity="0.7" />
+      <path {...F} d="M50,44 Q66,42 70,26 Q52,28 50,44 Z" opacity="0.7" />
+      <path {...F} d="M50,38 Q50,20 50,16 Q58,26 50,40 Z" opacity="0.7" />
+    </>
+  ),
+  clock: (
+    <>
+      <rect {...S} x="34" y="14" width="32" height="72" rx="4" />
+      <circle {...S} strokeWidth="4" cx="50" cy="32" r="11" />
+      <path {...S} strokeWidth="3" d="M50,32 L50,25 M50,32 L55,34" />
+      <line {...S} strokeWidth="3" x1="50" y1="48" x2="50" y2="70" opacity="0.7" />
+      <circle {...F} cx="50" cy="72" r="5" opacity="0.8" />
+    </>
+  ),
+  chest: (
+    <>
+      <path {...F} d="M22,42 Q22,26 50,26 Q78,26 78,42 L78,50 L22,50 Z" opacity="0.75" />
+      <rect {...F} x="22" y="50" width="56" height="26" rx="3" opacity="0.9" />
+      <rect {...F} x="45" y="44" width="10" height="14" rx="2" opacity="0.5" />
+      <line {...S} strokeWidth="4" x1="32" y1="28" x2="32" y2="76" opacity="0.45" />
+      <line {...S} strokeWidth="4" x1="68" y1="28" x2="68" y2="76" opacity="0.45" />
+    </>
+  ),
+  stove: (
+    <>
+      <rect {...F} x="24" y="38" width="52" height="42" rx="4" opacity="0.85" />
+      <rect {...S} strokeWidth="4" x="32" y="48" width="24" height="22" opacity="0.7" />
+      <circle {...F} cx="68" cy="46" r="3.5" opacity="0.6" />
+      <circle {...F} cx="68" cy="56" r="3.5" opacity="0.6" />
+      <path {...S} strokeWidth="5" d="M62,38 L62,22 Q62,16 68,16" opacity="0.8" />
+    </>
+  ),
+  bed: (
+    <>
+      <path {...S} d="M20,32 L20,76 M80,44 L80,76" />
+      <path {...F} d="M20,52 L80,52 L80,66 L20,66 Z" opacity="0.7" />
+      <rect {...F} x="24" y="44" width="18" height="9" rx="4" opacity="0.9" />
+      <path {...F} d="M20,32 Q26,26 32,32 L32,44 L20,44 Z" opacity="0.5" />
+    </>
+  ),
+  desk: (
+    <>
+      <rect {...F} x="18" y="36" width="64" height="8" rx="2" opacity="0.9" />
+      <rect {...S} strokeWidth="4" x="24" y="44" width="22" height="18" opacity="0.8" />
+      <circle {...F} cx="35" cy="53" r="2.5" opacity="0.8" />
+      <path {...S} d="M76,44 L76,78 M24,62 L24,78" />
+      <rect {...F} x="52" y="26" width="20" height="10" rx="1" opacity="0.5" transform="rotate(-6 62 31)" />
+    </>
+  ),
+  statue: (
+    <>
+      <rect {...F} x="32" y="70" width="36" height="12" opacity="0.85" />
+      <rect {...F} x="38" y="62" width="24" height="8" opacity="0.6" />
+      <path {...F} d="M44,62 Q40,48 46,40 Q42,34 47,28 Q44,20 50,18 Q56,20 53,28 Q58,34 54,40 Q60,48 56,62 Z" opacity="0.8" />
+    </>
+  ),
+  telescope: (
+    <>
+      <path {...F} d="M28,58 L64,26 L72,36 L36,68 Z" opacity="0.85" />
+      <path {...F} d="M62,20 L78,34 L74,39 L58,25 Z" opacity="0.6" />
+      <path {...S} d="M46,60 L36,84 M46,60 L58,84" />
+      <circle {...F} cx="47" cy="59" r="6" opacity="0.9" />
+    </>
+  ),
+  lamp: (
+    <>
+      <path {...F} d="M34,18 L66,18 L58,42 L42,42 Z" opacity="0.8" />
+      <line {...S} x1="50" y1="42" x2="50" y2="78" />
+      <path {...S} d="M36,84 Q50,76 64,84" />
+    </>
+  ),
+  mirror: (
+    <>
+      <ellipse {...S} cx="50" cy="42" rx="20" ry="26" />
+      <ellipse {...F} cx="50" cy="42" rx="14" ry="20" opacity="0.25" />
+      <path {...S} strokeWidth="3" d="M42,36 Q46,28 54,28" opacity="0.7" />
+      <path {...S} d="M40,70 L36,84 M60,70 L64,84 M38,80 L62,80" />
+    </>
+  ),
+  painting: (
+    <>
+      <rect {...S} x="22" y="24" width="56" height="46" />
+      <rect {...S} strokeWidth="2.5" x="29" y="31" width="42" height="32" opacity="0.6" />
+      <path {...S} strokeWidth="3" d="M32,56 L44,42 L52,50 L60,38 L68,50" opacity="0.8" />
+      <circle {...F} cx="62" cy="38" r="3" opacity="0.6" />
+    </>
+  ),
+  crate: (
+    <>
+      <rect {...S} x="24" y="28" width="52" height="48" />
+      <line {...S} strokeWidth="4" x1="24" y1="44" x2="76" y2="44" opacity="0.8" />
+      <line {...S} strokeWidth="4" x1="24" y1="60" x2="76" y2="60" opacity="0.8" />
+      <rect {...F} x="40" y="32" width="20" height="7" rx="2" opacity="0.6" />
+      <circle {...F} cx="31" cy="52" r="2.5" opacity="0.7" />
+      <circle {...F} cx="69" cy="52" r="2.5" opacity="0.7" />
+      <circle {...F} cx="31" cy="68" r="2.5" opacity="0.7" />
+      <circle {...F} cx="69" cy="68" r="2.5" opacity="0.7" />
+    </>
+  ),
+  harp: (
+    <>
+      <path {...S} d="M30,80 L30,30 Q30,14 48,16 Q68,18 70,44 L70,80" />
+      <path {...F} d="M26,78 L74,78 L70,86 L30,86 Z" opacity="0.85" />
+      {[38, 46, 54, 62].map((x, i) => (
+        <line key={i} {...S} strokeWidth="2.5" x1={x} y1={26 + i * 3} x2={x} y2="78" opacity="0.7" />
+      ))}
+    </>
+  )
+};
+
+export function ObjectIcon({ type, size = 40, className = '', title }) {
+  return (
+    <svg viewBox="0 0 100 100" width={size} height={size} className={`obj-icon ${className}`}
+      role="img" aria-label={title || type}>
+      {ICONS[type] || <circle {...S} cx="50" cy="50" r="26" />}
+    </svg>
+  );
+}