Huddle Bookmarklet

Open Huddle as a floating widget on any webpage — without leaving the site.

\n\n

Desktop: Drag the bookmark below to your browser's bookmarks bar

Mobile: Copy the code below, add a new bookmark manually, and paste it as the URL

Visit any page and tap or click the bookmarklet — Huddle floats on top

\n\n

Drag to bookmarks bar

\n 🔖\n

Drag this link to your bookmarks bar

\n Loading…\n

\n\n

Or copy for mobile

Loading…

\n \n

\n\n

\n 📱\n On mobile: tap Copy above → open your browser bookmarks → create a new bookmark → paste as the URL. Then tap it on any page to launch Huddle.\n

\n\n

\n\n \n\n ← Back to Huddle\n

\n\n\n\n","label",[195,70],"frontend","pulls","branches","forks","envVars",{"_203":26,"_205":26},"connections",{"_203":26,"_204":26},"count","unfilledCount","emptyCount",{"_35":315,"_13":306,"_68":300,"_45":-5,"_37":38,"_187":42,"_188":172,"_39":316,"_41":26,"_71":271,"_191":-5,"_72":24,"_193":-5,"_227":317,"_17":318},{"_35":307,"_13":308,"_68":309,"_45":300,"_37":38,"_187":310,"_188":172,"_39":311,"_41":42,"_71":250,"_191":312,"_72":24,"_193":-5,"_227":313,"_17":314},{"_35":297,"_13":298,"_68":299,"_45":300,"_37":38,"_187":301,"_188":172,"_39":302,"_41":42,"_71":250,"_191":303,"_72":24,"_193":-5,"_227":304,"_17":305},{"_35":293,"_13":195,"_68":186,"_45":-5,"_37":38,"_187":42,"_188":172,"_39":294,"_41":26,"_71":271,"_191":-5,"_72":24,"_193":-5,"_227":295,"_17":296},{"_35":185,"_13":70,"_68":69,"_45":186,"_37":38,"_187":95,"_188":172,"_39":290,"_41":190,"_71":21,"_191":192,"_72":24,"_193":-5,"_227":291,"_17":292},{"_35":283,"_13":284,"_68":285,"_45":186,"_37":38,"_187":137,"_188":172,"_39":286,"_41":190,"_71":21,"_191":287,"_72":24,"_193":-5,"_227":288,"_17":289},{"_35":274,"_13":275,"_68":276,"_45":186,"_37":38,"_187":277,"_188":172,"_39":278,"_41":279,"_71":21,"_191":280,"_72":24,"_193":-5,"_227":281,"_17":282},{"_35":269,"_13":254,"_68":248,"_45":-5,"_37":38,"_187":42,"_188":172,"_39":270,"_41":26,"_71":271,"_191":-5,"_72":24,"_193":-5,"_227":272,"_17":273},{"_35":262,"_13":263,"_68":264,"_45":248,"_37":38,"_187":42,"_188":172,"_39":265,"_41":26,"_71":250,"_191":266,"_72":24,"_193":-5,"_227":267,"_17":268},{"_35":255,"_13":256,"_68":257,"_45":248,"_37":38,"_187":42,"_188":172,"_39":258,"_41":26,"_71":250,"_191":259,"_72":24,"_193":-5,"_227":260,"_17":261},{"_35":245,"_13":246,"_68":247,"_45":248,"_37":38,"_187":42,"_188":172,"_39":249,"_41":26,"_71":250,"_191":251,"_72":24,"_193":-5,"_227":252,"_17":253},{"_35":238,"_13":239,"_68":240,"_45":-5,"_37":38,"_187":42,"_188":172,"_39":241,"_41":26,"_71":234,"_191":242,"_72":24,"_193":-5,"_227":243,"_17":244},{"_35":230,"_13":231,"_68":232,"_45":-5,"_37":38,"_187":42,"_188":172,"_39":233,"_41":26,"_71":234,"_191":235,"_72":24,"_193":-5,"_227":236,"_17":237},{"_35":220,"_13":221,"_68":222,"_45":-5,"_37":38,"_187":223,"_188":172,"_39":224,"_41":95,"_71":225,"_191":226,"_72":24,"_193":-5,"_227":228,"_17":229},"f915139a-2fb2-11f1-8e64-42dde27851f2","index.ts","019d5589-8f47-7698-b8c2-252ddff3218b",23,["D",1775258115460],"http","import { Hono } from \"npm:hono@4\";\nimport { getCookie, setCookie, deleteCookie } from \"npm:hono/cookie\";\nimport { blob } from \"https://esm.town/v/std/blob\";\nimport { serveFile, parseVal } from \"https://esm.town/v/std/utils/index.ts\";\nimport { runMigrations } from \"./database/migrations.ts\";\nimport {\n createUser, getUserByUsername, getUserByEmail, getUserById,\n createSession, getSession, deleteSession,\n createApiToken, getApiToken, deleteApiToken,\n createRoom, getRoomById, getRoomsForUser, getAllRooms, getRoomMembers,\n addRoomMember, removeRoomMember, isRoomMember, inviteToRoom,\n deleteRoom,\n createMessage, getMessages, editMessage, searchMessages, getMessageById,\n addReaction, removeReaction, getReactionsForRoom,\n setTyping, clearTyping, getTyping,\n blockUser, unblockUser, getBlockedUsers,\n queueMention, getPublicUsers, getAllUsers,\n setGhostMode, banUser, unbanUser, muteUser, unmuteUser,\n updateUserAvatar, updateUserPassword,\n} from \"./database/queries.ts\";\nimport { hashPassword, verifyPassword, generateToken } from \"./shared/auth.ts\";\nimport { sendEmail, mentionEmailHtml, recoveryEmailHtml } from \"./shared/email.ts\";\nimport { ADMIN_USERNAME, ADMIN_PASSWORD, MAX_FILE_SIZE, MAX_AVATAR_SIZE, MISTRAL_API_KEY, CODESTRAL_API_KEY } from \"./shared/types.ts\";\n\nawait runMigrations();\n\n// Ensure admin account exists\nconst adminExists = await getUserByUsername(ADMIN_USERNAME);\nif (!adminExists) {\n const hash = await hashPassword(ADMIN_PASSWORD);\n await createUser(ADMIN_USERNAME, \"admin@huddle.local\", hash, ADMIN_PASSWORD);\n}\n\nconst app = new Hono();\napp.onError((err) => Promise.reject(err));\n\n// ─── Auth helper ──────────────────────────────────────────────────────────────\nasync function getSessionUser(c: any) {\n // Try cookie session\n const sid = getCookie(c, \"hid\");\n if (sid) {\n const session = await getSession(sid);\n if (session) {\n const user = await getUserById(Number(session.user_id));\n if (user) return await checkExpiry(user);\n }\n }\n // Try Authorization Bearer token (for bookmarklet cross-origin)\n const auth = c.req.header(\"Authorization\");\n if (auth?.startsWith(\"Bearer \")) {\n const token = auth.slice(7);\n const rec = await getApiToken(token);\n if (rec) {\n const user = await getUserById(Number(rec.user_id));\n if (user) return await checkExpiry(user);\n }\n }\n return null;\n}\n\nasync function checkExpiry(user: any) {\n if (user.is_banned && user.ban_expires_at && new Date(user.ban_expires_at as string) < new Date()) {\n await unbanUser(Number(user.id));\n user.is_banned = 0;\n }\n if (user.is_muted && user.mute_expires_at && new Date(user.mute_expires_at as string) < new Date()) {\n await unmuteUser(Number(user.id));\n user.is_muted = 0;\n }\n return user;\n}\n\nfunction isAdmin(user: any) {\n return user && user.username.toLowerCase() === ADMIN_USERNAME.toLowerCase();\n}\n\nfunction userPayload(user: any) {\n return {\n id: Number(user.id),\n username: user.username,\n email: user.email,\n isAdmin: isAdmin(user),\n ghost_mode: user.ghost_mode,\n avatar_blob_key: user.avatar_blob_key,\n };\n}\n\n// ─── CORS middleware for bookmarklet ─────────────────────────────────────────\napp.use(\"*\", async (c, next) => {\n await next();\n c.res.headers.set(\"Access-Control-Allow-Origin\", \"*\");\n c.res.headers.set(\"Access-Control-Allow-Methods\", \"GET,POST,OPTIONS,DELETE,PUT\");\n c.res.headers.set(\"Access-Control-Allow-Headers\", \"Content-Type,Authorization\");\n});\n\napp.options(\"*\", (c) => new Response(null, { status: 204, headers: {\n \"Access-Control-Allow-Origin\": \"*\",\n \"Access-Control-Allow-Methods\": \"GET,POST,OPTIONS,DELETE,PUT\",\n \"Access-Control-Allow-Headers\": \"Content-Type,Authorization\",\n}}));\n\n// ─── Static files ─────────────────────────────────────────────────────────────\napp.get(\"/\", (c) => serveFile(\"/frontend/index.html\", import.meta.url));\napp.get(\"/bookmarklet\", (c) => serveFile(\"/frontend/bookmarklet.html\", import.meta.url));\napp.get(\"/frontend/*\", (c) => serveFile(c.req.path, import.meta.url));\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\n\n// ─── Auth routes ──────────────────────────────────────────────────────────────\napp.post(\"/api/signup\", async (c) => {\n const { username, email, password } = await c.req.json();\n if (!username || !email || !password) return c.json({ error: \"All fields required\" }, 400);\n if (password.length < 6) return c.json({ error: \"Password must be at least 6 characters\" }, 400);\n if (!/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/.test(email)) return c.json({ error: \"Invalid email address\" }, 400);\n if (!/^[a-zA-Z0-9_]{3,20}$/.test(username)) return c.json({ error: \"Username: 3–20 chars, letters/numbers/_ only\" }, 400);\n\n const existingUser = await getUserByUsername(username);\n if (existingUser) return c.json({ error: \"Username already taken\" }, 409);\n const existingEmail = await getUserByEmail(email);\n if (existingEmail) return c.json({ error: \"Email already registered\" }, 409);\n\n const hash = await hashPassword(password);\n const userId = await createUser(username, email, hash, password);\n const sid = generateToken();\n await createSession(sid, Number(userId));\n // Also create API token for bookmarklet cross-origin use\n const apiToken = generateToken();\n await createApiToken(apiToken, Number(userId));\n setCookie(c, \"hid\", sid, { httpOnly: true, sameSite: \"Lax\", maxAge: 60 * 60 * 24 * 30 });\n return c.json({ ok: true, apiToken, user: { id: Number(userId), username, email, isAdmin: isAdmin({ username }) } });\n});\n\napp.post(\"/api/login\", async (c) => {\n const { username, password } = await c.req.json();\n if (!username || !password) return c.json({ error: \"Username and password required\" }, 400);\n const user = await getUserByUsername(username);\n if (!user) return c.json({ error: \"Invalid credentials\" }, 401);\n if (user.is_banned) {\n const isPerm = !user.ban_expires_at;\n const isActive = isPerm || new Date(user.ban_expires_at as string) > new Date();\n if (isActive) {\n const msg = user.ban_message ? `\\n\\n${user.ban_message}` : \"\";\n const exp = isPerm ? \" permanently\" : ` until ${new Date(user.ban_expires_at as string).toLocaleString()}`;\n return c.json({ error: `Your account has been banned${exp}.${msg}` }, 403);\n }\n }\n const ok = await verifyPassword(password as string, user.password_hash as string);\n if (!ok) return c.json({ error: \"Invalid credentials\" }, 401);\n const sid = generateToken();\n await createSession(sid, Number(user.id));\n // Issue fresh API token\n const apiToken = generateToken();\n await createApiToken(apiToken, Number(user.id));\n setCookie(c, \"hid\", sid, { httpOnly: true, sameSite: \"Lax\", maxAge: 60 * 60 * 24 * 30 });\n return c.json({ ok: true, apiToken, user: userPayload(user) });\n});\n\napp.post(\"/api/logout\", async (c) => {\n const sid = getCookie(c, \"hid\");\n if (sid) await deleteSession(sid);\n // Delete API token if provided\n const auth = c.req.header(\"Authorization\");\n if (auth?.startsWith(\"Bearer \")) await deleteApiToken(auth.slice(7));\n deleteCookie(c, \"hid\");\n return c.json({ ok: true });\n});\n\napp.get(\"/api/me\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n return c.json({ user: userPayload(user) });\n});\n\n// ─── Password recovery (sends actual password) ────────────────────────────────\napp.post(\"/api/recover\", async (c) => {\n const { identifier } = await c.req.json();\n if (!identifier) return c.json({ error: \"Email or username required\" }, 400);\n const user = identifier.includes(\"@\") ? await getUserByEmail(identifier) : await getUserByUsername(identifier);\n if (!user) return c.json({ ok: true }); // don't reveal existence\n const plain = user.password_plain as string | null;\n if (!plain) {\n // No stored plain password — can't recover, send info\n await sendEmail(user.email as string, \"Huddle – Password Recovery\", recoveryEmailHtml(\"[Password recovery not available — please contact admin]\"));\n } else {\n await sendEmail(user.email as string, \"Huddle – Password Recovery\", recoveryEmailHtml(plain));\n }\n return c.json({ ok: true });\n});\n\n// ─── Users ────────────────────────────────────────────────────────────────────\napp.get(\"/api/users\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n if (isAdmin(user)) {\n const users = await getAllUsers();\n return c.json({ users });\n }\n const users = await getPublicUsers();\n return c.json({ users });\n});\n\napp.post(\"/api/users/ghost\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const { ghost } = await c.req.json();\n await setGhostMode(Number(user.id), ghost);\n return c.json({ ok: true });\n});\n\napp.post(\"/api/users/:id/ban\", async (c) => {\n const user = await getSessionUser(c);\n if (!user || !isAdmin(user)) return c.json({ error: \"Forbidden\" }, 403);\n const targetId = Number(c.req.param(\"id\"));\n const { duration, message } = await c.req.json(); // duration in hours, null = permanent\n const expiresAt = duration ? new Date(Date.now() + duration * 3600000).toISOString() : null;\n await banUser(targetId, expiresAt, message ?? null);\n return c.json({ ok: true });\n});\n\napp.post(\"/api/users/:id/unban\", async (c) => {\n const user = await getSessionUser(c);\n if (!user || !isAdmin(user)) return c.json({ error: \"Forbidden\" }, 403);\n await unbanUser(Number(c.req.param(\"id\")));\n return c.json({ ok: true });\n});\n\napp.post(\"/api/users/:id/mute\", async (c) => {\n const user = await getSessionUser(c);\n if (!user || !isAdmin(user)) return c.json({ error: \"Forbidden\" }, 403);\n const { duration } = await c.req.json(); // duration in minutes\n const expiresAt = new Date(Date.now() + (duration || 30) * 60000).toISOString();\n await muteUser(Number(c.req.param(\"id\")), expiresAt);\n return c.json({ ok: true });\n});\n\napp.post(\"/api/users/:id/unmute\", async (c) => {\n const user = await getSessionUser(c);\n if (!user || !isAdmin(user)) return c.json({ error: \"Forbidden\" }, 403);\n await unmuteUser(Number(c.req.param(\"id\")));\n return c.json({ ok: true });\n});\n\napp.get(\"/api/users/blocked\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const blocked = await getBlockedUsers(Number(user.id));\n return c.json({ blocked });\n});\n\napp.post(\"/api/users/:id/block\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n await blockUser(Number(user.id), Number(c.req.param(\"id\")));\n return c.json({ ok: true });\n});\n\napp.post(\"/api/users/:id/unblock\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n await unblockUser(Number(user.id), Number(c.req.param(\"id\")));\n return c.json({ ok: true });\n});\n\n// ─── Avatar upload ────────────────────────────────────────────────────────────\napp.post(\"/api/avatar\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const formData = await c.req.formData();\n const file = formData.get(\"avatar\") as File | null;\n if (!file) return c.json({ error: \"No file\" }, 400);\n if (file.size > MAX_AVATAR_SIZE) return c.json({ error: \"Avatar max size is 100 KB\" }, 400);\n const key = `huddle_avatar_${user.id}_${Date.now()}`;\n const buf = await file.arrayBuffer();\n await blob.set(key, buf);\n // Avatar blobs are permanent — only chat file blobs expire after 12h\n await updateUserAvatar(Number(user.id), key);\n return c.json({ ok: true, key });\n});\n\napp.get(\"/api/blob/:key\", async (c) => {\n const key = c.req.param(\"key\");\n // Avatar blobs are public (no sensitive data). All other blobs require auth.\n const isAvatar = key.startsWith(\"huddle_avatar_\");\n if (!isAvatar) {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n }\n\n // blob.get() returns a Response; throws ValTownBlobNotFoundError if missing\n let buf: ArrayBuffer;\n try {\n const resp = await blob.get(key);\n buf = await resp.arrayBuffer();\n } catch {\n return c.json({ error: \"File not found or has expired\" }, 404);\n }\n\n // Detect MIME from the key — the file upload key ends with the original filename\n // e.g. huddle_file_1_2_1234567890_photo.jpg → image/jpeg\n const lk = key.toLowerCase();\n const mimeMap: Record = {\n \".jpg\": \"image/jpeg\", \".jpeg\": \"image/jpeg\", \".png\": \"image/png\",\n \".gif\": \"image/gif\", \".webp\": \"image/webp\", \".svg\": \"image/svg+xml\",\n \".pdf\": \"application/pdf\", \".txt\": \"text/plain; charset=utf-8\",\n \".md\": \"text/plain; charset=utf-8\", \".csv\": \"text/csv; charset=utf-8\",\n \".mp4\": \"video/mp4\", \".mp3\": \"audio/mpeg\", \".wav\": \"audio/wav\",\n \".zip\": \"application/zip\", \".json\": \"application/json\",\n \".html\": \"text/html; charset=utf-8\", \".htm\": \"text/html; charset=utf-8\",\n \".js\": \"text/javascript\", \".ts\": \"text/plain; charset=utf-8\", \".css\": \"text/css\",\n \".docx\": \"application/vnd.openxmlformats-officedocument.wordprocessingml.document\",\n \".xlsx\": \"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet\",\n };\n let ct = \"application/octet-stream\";\n for (const [ext, mime] of Object.entries(mimeMap)) {\n if (lk.endsWith(ext)) { ct = mime; break; }\n }\n\n // For avatars (key has no extension), sniff MIME from magic bytes\n if (ct === \"application/octet-stream\") {\n const bytes = new Uint8Array(buf).subarray(0, 4);\n if (bytes[0] === 0xFF && bytes[1] === 0xD8) ct = \"image/jpeg\";\n else if (bytes[0] === 0x89 && bytes[1] === 0x50) ct = \"image/png\";\n else if (bytes[0] === 0x47 && bytes[1] === 0x49) ct = \"image/gif\";\n else if (bytes[0] === 0x52 && bytes[1] === 0x49) ct = \"image/webp\";\n }\n\n return new Response(buf, {\n headers: {\n \"Content-Type\": ct,\n \"Cache-Control\": isAvatar ? \"public, max-age=86400\" : \"private, max-age=3600\",\n \"Access-Control-Allow-Origin\": \"*\",\n },\n });\n});\n\n// ─── Rooms ────────────────────────────────────────────────────────────────────\napp.get(\"/api/rooms\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const rooms = isAdmin(user) ? await getAllRooms() : await getRoomsForUser(Number(user.id));\n return c.json({ rooms });\n});\n\napp.post(\"/api/rooms\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const { name } = await c.req.json();\n if (!name?.trim()) return c.json({ error: \"Room name required\" }, 400);\n const roomId = await createRoom(name.trim(), Number(user.id));\n return c.json({ ok: true, roomId });\n});\n\napp.delete(\"/api/rooms/:id\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const roomId = Number(c.req.param(\"id\"));\n const room = await getRoomById(roomId);\n if (!room) return c.json({ error: \"Room not found\" }, 404);\n if (room.type === \"world\") return c.json({ error: \"Cannot delete World Chat\" }, 403);\n if (!isAdmin(user) && Number(room.created_by) !== Number(user.id)) return c.json({ error: \"Only the creator can delete this room\" }, 403);\n await deleteRoom(roomId);\n return c.json({ ok: true });\n});\n\napp.get(\"/api/rooms/:id/members\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const roomId = Number(c.req.param(\"id\"));\n const room = await getRoomById(roomId);\n if (!room) return c.json({ error: \"Room not found\" }, 404);\n if (room.type !== \"world\" && !isAdmin(user) && !(await isRoomMember(roomId, Number(user.id)))) {\n return c.json({ error: \"Forbidden\" }, 403);\n }\n const members = await getRoomMembers(roomId);\n return c.json({ members });\n});\n\napp.post(\"/api/rooms/:id/invite\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const roomId = Number(c.req.param(\"id\"));\n const { username } = await c.req.json();\n if (!username) return c.json({ error: \"Username required\" }, 400);\n // Only owner or admin can invite\n const room = await getRoomById(roomId);\n if (!room) return c.json({ error: \"Room not found\" }, 404);\n if (!isAdmin(user) && Number(room.created_by) !== Number(user.id)) {\n const members = await getRoomMembers(roomId);\n const caller = members.find((m: any) => Number(m.id) === Number(user.id));\n if (!caller || caller.role !== \"owner\") return c.json({ error: \"Only the room owner can invite\" }, 403);\n }\n const target = await getUserByUsername(username);\n if (!target) return c.json({ error: \"User not found\" }, 404);\n await inviteToRoom(roomId, Number(target.id), Number(user.id));\n return c.json({ ok: true });\n});\n\napp.post(\"/api/rooms/:id/kick\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const roomId = Number(c.req.param(\"id\"));\n const { userId } = await c.req.json();\n const room = await getRoomById(roomId);\n if (!room) return c.json({ error: \"Room not found\" }, 404);\n if (!isAdmin(user) && Number(room.created_by) !== Number(user.id)) {\n const members = await getRoomMembers(roomId);\n const caller = members.find((m: any) => Number(m.id) === Number(user.id));\n if (!caller || caller.role !== \"owner\") return c.json({ error: \"Forbidden\" }, 403);\n }\n await removeRoomMember(roomId, Number(userId));\n return c.json({ ok: true });\n});\n\napp.post(\"/api/rooms/:id/leave\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const roomId = Number(c.req.param(\"id\"));\n await removeRoomMember(roomId, Number(user.id));\n return c.json({ ok: true });\n});\n\n// ─── Messages ─────────────────────────────────────────────────────────────────\napp.get(\"/api/rooms/:id/messages\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const roomId = Number(c.req.param(\"id\"));\n const room = await getRoomById(roomId);\n if (!room) return c.json({ error: \"Room not found\" }, 404);\n if (room.type !== \"world\" && !isAdmin(user) && !(await isRoomMember(roomId, Number(user.id)))) {\n return c.json({ error: \"Forbidden\" }, 403);\n }\n const since = c.req.query(\"since\") ? Number(c.req.query(\"since\")) : undefined;\n const msgs = await getMessages(roomId, since);\n const blocked = await getBlockedUsers(Number(user.id));\n const filtered = isAdmin(user) ? msgs : msgs.filter((m: any) => !blocked.includes(Number(m.user_id)));\n // Attach reactions if loading full history (no since param)\n let reactions: any[] = [];\n if (!since) reactions = await getReactionsForRoom(roomId);\n return c.json({ messages: filtered, reactions });\n});\n\n// Long polling endpoint\napp.get(\"/api/rooms/:id/poll\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const roomId = Number(c.req.param(\"id\"));\n const room = await getRoomById(roomId);\n if (!room) return c.json({ error: \"Room not found\" }, 404);\n if (room.type !== \"world\" && !isAdmin(user) && !(await isRoomMember(roomId, Number(user.id)))) {\n return c.json({ error: \"Forbidden\" }, 403);\n }\n const since = Number(c.req.query(\"since\") ?? 0);\n const blocked = await getBlockedUsers(Number(user.id));\n const deadline = Date.now() + 25000;\n while (Date.now() < deadline) {\n const msgs = await getMessages(roomId, since);\n const typing = await getTyping(roomId);\n const typingOthers = typing.filter((u: string) => u !== (user.username as string));\n if (msgs.length > 0) {\n const filtered = isAdmin(user) ? msgs : msgs.filter((m: any) => !blocked.includes(Number(m.user_id)));\n return c.json({ messages: filtered, typing: typingOthers });\n }\n if (typingOthers.length > 0) {\n return c.json({ messages: [], typing: typingOthers });\n }\n await new Promise((r) => setTimeout(r, 1000));\n }\n return c.json({ messages: [], typing: [] });\n});\n\napp.post(\"/api/rooms/:id/messages\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n if (user.is_muted && user.mute_expires_at && new Date(user.mute_expires_at as string) > new Date()) {\n return c.json({ error: \"You are currently muted\" }, 403);\n }\n const roomId = Number(c.req.param(\"id\"));\n const room = await getRoomById(roomId);\n if (!room) return c.json({ error: \"Room not found\" }, 404);\n if (room.type !== \"world\" && !isAdmin(user) && !(await isRoomMember(roomId, Number(user.id)))) {\n return c.json({ error: \"Forbidden\" }, 403);\n }\n const { content, reply_to_id } = await c.req.json();\n if (!content?.trim()) return c.json({ error: \"Message cannot be empty\" }, 400);\n if (content.length > 2000) return c.json({ error: \"Message too long (max 2000 chars)\" }, 400);\n await createMessage(roomId, Number(user.id), content.trim(), undefined, undefined, undefined, reply_to_id ? Number(reply_to_id) : undefined);\n // Parse @mentions\n const mentionRegex = /@([a-zA-Z0-9_]+)/g;\n let match;\n while ((match = mentionRegex.exec(content)) !== null) {\n const mentioned = await getUserByUsername(match[1]);\n if (mentioned && Number(mentioned.id) !== Number(user.id)) {\n await queueMention(Number(mentioned.id), user.username as string, room.name as string);\n }\n }\n return c.json({ ok: true });\n});\n\n// ─── File upload ──────────────────────────────────────────────────────────────\napp.post(\"/api/rooms/:id/upload\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n if (user.is_muted && user.mute_expires_at && new Date(user.mute_expires_at as string) > new Date()) {\n return c.json({ error: \"You are currently muted\" }, 403);\n }\n const roomId = Number(c.req.param(\"id\"));\n const room = await getRoomById(roomId);\n if (!room) return c.json({ error: \"Room not found\" }, 404);\n if (room.type !== \"world\" && !isAdmin(user) && !(await isRoomMember(roomId, Number(user.id)))) {\n return c.json({ error: \"Forbidden\" }, 403);\n }\n const formData = await c.req.formData();\n const file = formData.get(\"file\") as File | null;\n if (!file) return c.json({ error: \"No file\" }, 400);\n if (file.size > MAX_FILE_SIZE) return c.json({ error: \"File max size is 200 KB\" }, 400);\n const key = `huddle_file_${roomId}_${user.id}_${Date.now()}_${file.name}`;\n const buf = await file.arrayBuffer();\n await blob.set(key, buf);\n await createMessage(roomId, Number(user.id), null, key, file.name, file.size);\n return c.json({ ok: true });\n});\n\n// ─── Message edit ─────────────────────────────────────────────────────────────\napp.patch(\"/api/messages/:id\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const msgId = Number(c.req.param(\"id\"));\n const { content } = await c.req.json();\n if (!content?.trim()) return c.json({ error: \"Content required\" }, 400);\n if (content.length > 2000) return c.json({ error: \"Message too long\" }, 400);\n const msg = await getMessageById(msgId);\n if (!msg) return c.json({ error: \"Not found\" }, 404);\n if (Number(msg.user_id) !== Number(user.id) && !isAdmin(user)) return c.json({ error: \"Forbidden\" }, 403);\n // 5 minute edit window for non-admins\n if (!isAdmin(user)) {\n const createdAt = new Date(msg.created_at as string).getTime();\n if (Date.now() - createdAt > 5 * 60 * 1000) return c.json({ error: \"Edit window expired (5 min)\" }, 403);\n }\n await editMessage(msgId, Number(user.id), content.trim());\n return c.json({ ok: true });\n});\n\n// ─── Message search ───────────────────────────────────────────────────────────\napp.get(\"/api/rooms/:id/search\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const roomId = Number(c.req.param(\"id\"));\n const room = await getRoomById(roomId);\n if (!room) return c.json({ error: \"Room not found\" }, 404);\n if (room.type !== \"world\" && !isAdmin(user) && !(await isRoomMember(roomId, Number(user.id)))) {\n return c.json({ error: \"Forbidden\" }, 403);\n }\n const q = c.req.query(\"q\") ?? \"\";\n if (q.trim().length < 2) return c.json({ messages: [] });\n const msgs = await searchMessages(roomId, q.trim());\n return c.json({ messages: msgs });\n});\n\n// ─── Reactions ────────────────────────────────────────────────────────────────\napp.post(\"/api/messages/:id/react\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const msgId = Number(c.req.param(\"id\"));\n const { emoji } = await c.req.json();\n if (!emoji) return c.json({ error: \"Emoji required\" }, 400);\n const ALLOWED = [\"👍\",\"❤️\",\"😂\",\"😮\",\"😢\",\"🔥\",\"👀\",\"🎉\",\"💯\",\"🤔\"];\n if (!ALLOWED.includes(emoji)) return c.json({ error: \"Emoji not allowed\" }, 400);\n await addReaction(msgId, Number(user.id), emoji);\n return c.json({ ok: true });\n});\n\napp.delete(\"/api/messages/:id/react\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const msgId = Number(c.req.param(\"id\"));\n const { emoji } = await c.req.json();\n await removeReaction(msgId, Number(user.id), emoji);\n return c.json({ ok: true });\n});\n\n// ─── Typing indicators ────────────────────────────────────────────────────────\napp.post(\"/api/rooms/:id/typing\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const roomId = Number(c.req.param(\"id\"));\n const { typing } = await c.req.json();\n if (typing) {\n await setTyping(roomId, Number(user.id), user.username as string);\n } else {\n await clearTyping(roomId, Number(user.id));\n }\n return c.json({ ok: true });\n});\n\n// ─── Link preview ─────────────────────────────────────────────────────────────\napp.get(\"/api/link-preview\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const url = c.req.query(\"url\");\n if (!url) return c.json({ error: \"URL required\" }, 400);\n try {\n const resp = await fetch(url, {\n headers: { \"User-Agent\": \"Mozilla/5.0 (compatible; Huddle/1.0)\" },\n signal: AbortSignal.timeout(5000),\n });\n if (!resp.ok) return c.json({ error: \"Failed to fetch\" }, 502);\n const html = await resp.text();\n const getTag = (prop: string) => {\n const m = html.match(new RegExp(`]+(?:property|name)=[\"']${prop}[\"'][^>]+content=[\"']([^\"']+)[\"']`, \"i\"))\n || html.match(new RegExp(`]+content=[\"']([^\"']+)[\"'][^>]+(?:property|name)=[\"']${prop}[\"']`, \"i\"));\n return m?.[1] ?? null;\n };\n const titleMatch = html.match(/]*>([^<]+)<\\/title>/i);\n const title = getTag(\"og:title\") || getTag(\"twitter:title\") || titleMatch?.[1]?.trim() || null;\n const description = getTag(\"og:description\") || getTag(\"twitter:description\") || getTag(\"description\") || null;\n const image = getTag(\"og:image\") || getTag(\"twitter:image\") || null;\n const siteName = getTag(\"og:site_name\") || null;\n return c.json({ title, description, image, siteName, url });\n } catch {\n return c.json({ error: \"Could not fetch URL\" }, 502);\n }\n});\n\n// ─── AI Chat (Mistral Large / Codestral) ─────────────────────────────────────\napp.post(\"/api/ai/chat\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const { messages, model } = await c.req.json();\n if (!messages?.length) return c.json({ error: \"Messages required\" }, 400);\n\n const isCodestral = model === \"codestral-latest\";\n const apiKey = isCodestral ? CODESTRAL_API_KEY : MISTRAL_API_KEY;\n const apiUrl = isCodestral\n ? \"https://codestral.mistral.ai/v1/chat/completions\"\n : \"https://api.mistral.ai/v1/chat/completions\";\n const selectedModel = isCodestral ? \"codestral-latest\" : \"mistral-large-latest\";\n const systemPrompt = isCodestral\n ? \"You are Codestral, an AI coding assistant built into Huddle. Help with debugging, code generation, code review, and technical questions. Be precise and include code examples.\"\n : \"You are a helpful AI assistant built into Huddle, a modern messaging platform. Be concise, friendly, and helpful.\";\n\n const resp = await fetch(apiUrl, {\n method: \"POST\",\n headers: {\n \"Authorization\": `Bearer ${apiKey}`,\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify({\n model: selectedModel,\n messages: [\n { role: \"system\", content: systemPrompt },\n ...messages,\n ],\n max_tokens: 1024,\n }),\n });\n\n if (!resp.ok) {\n const err = await resp.text();\n console.error(\"AI error:\", err);\n return c.json({ error: \"AI service error\" }, 502);\n }\n const data = await resp.json();\n return c.json({ reply: data.choices?.[0]?.message?.content ?? \"\" });\n});\n\nexport default app.fetch;\n","children",[],[221],"60f247a2-2faf-11f1-8789-42dde27851f2","cron-mentions.ts","019d5589-8f47-7698-b8c2-2093b0281b14",["D",1775256571628],"interval","// Huddle — @mention email digest (runs every 6 hours)\nimport { getUnsentMentions, markMentionsSent } from \"./database/queries.ts\";\nimport { sendEmail, mentionEmailHtml } from \"./shared/email.ts\";\n\nexport default async function (_interval: Interval) {\n const mentions = await getUnsentMentions();\n if (!mentions.length) return;\n\n // Group by mentioned user\n const byUser = new Map }>();\n for (const m of mentions) {\n const uid = Number(m.mentioned_user_id);\n if (!byUser.has(uid)) {\n byUser.set(uid, { email: m.email as string, username: m.mentioned_username as string, mentions: [] });\n }\n byUser.get(uid)!.mentions.push({ sender_username: m.sender_username as string, room_name: m.room_name as string });\n }\n\n const sentIds: number[] = [];\n for (const [, data] of byUser) {\n const subject = `Huddle – You were mentioned ${data.mentions.length > 1 ? data.mentions.length + \" times\" : \"\"}`.trim();\n const html = mentionEmailHtml(data.mentions);\n const ok = await sendEmail(data.email, subject, html);\n if (ok) {\n const ids = mentions.filter((m) => m.email === data.email).map((m) => Number(m.id));\n sentIds.push(...ids);\n }\n }\n\n if (sentIds.length) await markMentionsSent(sentIds);\n console.log(`Mention digest: ${byUser.size} users, ${sentIds.length} mentions sent`);\n}\n",[],[231],"60f23fe6-2faf-11f1-8789-42dde27851f2","cron-cleanup.ts","019d5589-8f47-7698-b8c2-1e2a47246dc8",["D",1775256571628],"// Huddle — blob cleanup (runs every 6 hours, removes chat file blobs older than 12h)\n// Profile avatars are NEVER deleted — they persist indefinitely\nimport { blob } from \"https://esm.town/v/std/blob\";\nimport { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\n\nexport default async function (_interval: Interval) {\n const cutoff = new Date(Date.now() - 12 * 3600 * 1000).toISOString();\n\n // Remove file blobs from messages older than 12h (chat uploads only, NOT avatars)\n const expiredMsgs = await sqlite.execute({\n sql: `SELECT blob_key FROM messages WHERE blob_key IS NOT NULL AND created_at < ?`,\n args: [cutoff],\n });\n let deleted = 0;\n for (const row of expiredMsgs.rows) {\n if (row.blob_key) {\n try { await blob.delete(row.blob_key as string); deleted++; } catch {}\n }\n }\n\n console.log(`Blob cleanup: removed ${deleted} expired chat file blobs (avatars are permanent)`);\n}\n",[],[239],"60f23956-2faf-11f1-8789-42dde27851f2","types.ts","019d5589-8f47-7698-b8c2-15894779b143","019d5589-8f47-7698-b8c2-1aa4314ec7a6",["D",1775256571628],"script","export const ADMIN_USERNAME = \"mjk\";\nexport const ADMIN_PASSWORD = \"110908\";\nexport const MAX_FILE_SIZE = 200 * 1024; // 200 KB\nexport const MAX_AVATAR_SIZE = 100 * 1024; // 100 KB\nexport const MENTION_EMAIL_INTERVAL_HOURS = 6;\nexport const APP_NAME = \"Huddle\";\nexport const MISTRAL_API_KEY = \"NMJb1HJcdzM7GnzYxvXp3VDVC8L0PcFB\";\nexport const CODESTRAL_API_KEY = \"fMTrjftODu0xedkR1deQh0YyEJZPBLnJ\";\nexport const RESEND_API_KEY = \"re_81SGe9Uh_MqSo2yX182iPDJkS3xVzeXZU\";\n",[],[254,246],"shared","60f22894-2faf-11f1-8789-42dde27851f2","email.ts","019d5589-8f47-7698-b8c2-108ef1e46936",["D",1775256571628],"import { RESEND_API_KEY, APP_NAME } from \"./types.ts\";\n\nconst FROM_EMAIL = `${APP_NAME} `;\n\nexport async function sendEmail(to: string, subject: string, html: string): Promise {\n if (!RESEND_API_KEY) {\n console.warn(\"RESEND_API_KEY not set, skipping email to\", to);\n return false;\n }\n try {\n const res = await fetch(\"https://api.resend.com/emails\", {\n method: \"POST\",\n headers: {\n Authorization: `Bearer ${RESEND_API_KEY}`,\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify({ from: FROM_EMAIL, to, subject, html }),\n });\n if (!res.ok) {\n const err = await res.text();\n console.error(\"Resend error:\", err);\n return false;\n }\n return true;\n } catch (e) {\n console.error(\"Email send failed:\", e);\n return false;\n }\n}\n\nexport function mentionEmailHtml(mentions: Array<{ sender_username: string; room_name: string }>): string {\n const items = mentions\n .map((m) => `

${m.sender_username} mentioned you in ${m.room_name}

`)\n .join(\"\");\n return `\n

Huddle — You were mentioned

You have new mentions in Huddle:

${items}\n

`;\n}\n\nexport function recoveryEmailHtml(password: string): string {\n return `\n

Huddle — Password Recovery

Your Huddle account password is:

${password}

If you did not request this, please change your password immediately after logging in.

`;\n}\n",[],[254,256],"60f21cfa-2faf-11f1-8789-42dde27851f2","auth.ts","019d5589-8f47-7698-b8c2-0d15de85a1c4",["D",1775256571628],"import bcrypt from \"npm:bcryptjs\";\n\nexport async function hashPassword(password: string): Promise {\n return bcrypt.hash(password, 10);\n}\n\nexport async function verifyPassword(password: string, hash: string): Promise {\n return bcrypt.compare(password, hash);\n}\n\nexport function generateToken(length = 32): string {\n const arr = new Uint8Array(length);\n crypto.getRandomValues(arr);\n return Array.from(arr).map((b) => b.toString(16).padStart(2, \"0\")).join(\"\");\n}\n",[],[254,263],"60f23e7e-2faf-11f1-8789-42dde27851f2",["D",1775256571628],"directory",[214,215,216],[254],"744f8056-2fb1-11f1-8c19-42dde27851f2","style.css","019d5589-8f47-7698-b8c2-06c72a31f900",16,["D",1775257463218],9,"*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }\n\n@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');\n\n:root {\n --bg: #0b0d15;\n --surface: #111420;\n --surface2: #181c2a;\n --surface3: #1f2336;\n --border: #252840;\n --border-light: #2e3350;\n --accent: #5b5ef5;\n --accent2: #7c7ff7;\n --accent-soft: rgba(91,94,245,0.12);\n --accent-glow: rgba(91,94,245,0.2);\n --text: #e2e6f3;\n --text-muted: #8891b4;\n --text-dim: #454c6a;\n --danger: #f06a6a;\n --danger-bg: rgba(240,106,106,0.08);\n --success: #3dd68c;\n --success-bg: rgba(61,214,140,0.08);\n --warn: #f5a623;\n --msg-other: #14172250;\n --msg-own: #1a1e3880;\n --msg-own-border: rgba(91,94,245,0.25);\n --radius: 14px;\n --radius-sm: 9px;\n --radius-xs: 6px;\n --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;\n --shadow: 0 4px 24px rgba(0,0,0,0.4);\n --shadow-lg: 0 32px 64px rgba(0,0,0,0.55), 0 0 0 1px rgba(255,255,255,0.03);\n}\n\nbody {\n font-family: var(--font);\n background: var(--bg);\n color: var(--text);\n height: 100vh;\n overflow: hidden;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n font-style: normal;\n}\n\n/* Kill every source of italic globally */\n*, *::before, *::after { font-style: normal !important; }\n\n#root { height: 100vh; display: flex; flex-direction: column; }\n\n/* ─── Scrollbars ─────────────────────────────── */\n* { scrollbar-width: thin; scrollbar-color: var(--border-light) transparent; }\n::-webkit-scrollbar { width: 4px; height: 4px; }\n::-webkit-scrollbar-track { background: transparent; }\n::-webkit-scrollbar-thumb { background: var(--border-light); border-radius: 99px; }\n\n/* ─── Auth Screen ────────────────────────────── */\n@keyframes authGlow {\n 0% { transform: translate(-50%,-50%) scale(1); opacity: 0.18; }\n 50% { transform: translate(-50%,-50%) scale(1.15); opacity: 0.26; }\n 100% { transform: translate(-50%,-50%) scale(1); opacity: 0.18; }\n}\n.auth-screen {\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 100vh;\n background: var(--bg);\n overflow: hidden;\n position: relative;\n}\n.auth-screen::before {\n content: '';\n position: absolute;\n width: 600px; height: 600px;\n border-radius: 50%;\n background: radial-gradient(circle, rgba(91,94,245,0.5) 0%, transparent 70%);\n top: 50%; left: 50%;\n transform: translate(-50%,-50%);\n animation: authGlow 6s ease-in-out infinite;\n pointer-events: none;\n}\n.auth-screen::after {\n content: '';\n position: absolute;\n inset: 0;\n background: radial-gradient(ellipse 120% 60% at 30% 80%, rgba(124,127,247,0.1) 0%, transparent 60%);\n pointer-events: none;\n}\n\n.auth-card {\n background: var(--surface);\n border: 1px solid var(--border);\n border-radius: var(--radius);\n padding: 2.25rem 2rem;\n width: 100%;\n max-width: 400px;\n box-shadow: var(--shadow-lg);\n position: relative;\n z-index: 1;\n}\n\n.auth-logo {\n display: flex;\n align-items: center;\n gap: 0.6rem;\n margin-bottom: 0.35rem;\n}\n\n.auth-logo-text {\n font-size: 1.75rem;\n font-weight: 800;\n background: linear-gradient(135deg, var(--accent2), #a5b4fc);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n letter-spacing: -0.5px;\n font-style: normal !important;\n}\n\n.auth-subtitle {\n color: var(--text-muted);\n font-size: 0.875rem;\n margin-bottom: 1.75rem;\n font-weight: 400;\n line-height: 1.5;\n font-style: normal !important;\n}\n\n.form-group { margin-bottom: 1rem; }\n.form-group label {\n display: block;\n font-size: 0.775rem;\n color: var(--text-muted);\n margin-bottom: 0.35rem;\n font-weight: 600;\n letter-spacing: 0.03em;\n font-style: normal !important;\n}\n\ninput[type=\"text\"], input[type=\"email\"], input[type=\"password\"], input[type=\"number\"] {\n width: 100%;\n padding: 0.65rem 0.9rem;\n background: var(--surface2);\n border: 1px solid var(--border);\n border-radius: var(--radius-sm);\n color: var(--text);\n font-size: 0.9rem;\n font-family: var(--font);\n font-style: normal !important;\n outline: none;\n transition: border-color 0.18s, box-shadow 0.18s;\n}\n\ninput:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-glow); }\ninput::placeholder { color: var(--text-dim); font-style: normal !important; }\n\n.btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 0.4rem;\n padding: 0.6rem 1.2rem;\n border-radius: var(--radius-sm);\n border: none;\n cursor: pointer;\n font-size: 0.85rem;\n font-weight: 600;\n font-family: var(--font);\n font-style: normal !important;\n transition: all 0.15s;\n text-decoration: none;\n line-height: 1;\n white-space: nowrap;\n}\n\n.btn:disabled { opacity: 0.45; cursor: not-allowed; }\n.btn-primary { background: var(--accent); color: #fff; width: 100%; margin-top: 0.25rem; }\n.btn-primary:hover:not(:disabled) { background: var(--accent2); box-shadow: 0 4px 20px rgba(91,94,245,0.4); transform: translateY(-1px); }\n.btn-ghost { background: transparent; color: var(--text-muted); border: 1px solid var(--border); }\n.btn-ghost:hover { color: var(--text); border-color: var(--border-light); background: var(--surface2); }\n.btn-danger { background: var(--danger-bg); color: var(--danger); border: 1px solid rgba(240,106,106,0.25); }\n.btn-danger:hover { background: rgba(240,106,106,0.15); border-color: rgba(240,106,106,0.4); }\n.btn-sm { padding: 0.3rem 0.65rem; font-size: 0.76rem; border-radius: var(--radius-xs); }\n\n.error-msg { background: var(--danger-bg); border: 1px solid rgba(240,106,106,0.25); color: var(--danger); padding: 0.6rem 0.875rem; border-radius: var(--radius-sm); font-size: 0.82rem; margin-bottom: 1rem; line-height: 1.45; font-style: normal !important; }\n.success-msg { background: var(--success-bg); border: 1px solid rgba(61,214,140,0.25); color: var(--success); padding: 0.6rem 0.875rem; border-radius: var(--radius-sm); font-size: 0.82rem; margin-bottom: 1rem; line-height: 1.45; font-style: normal !important; }\n\n.auth-toggle { text-align: center; margin-top: 1.25rem; font-size: 0.83rem; color: var(--text-muted); }\n.auth-toggle button { background: none; border: none; color: var(--accent2); cursor: pointer; font-weight: 600; font-family: var(--font); font-size: inherit; font-style: normal !important; }\n.auth-toggle button:hover { text-decoration: underline; }\n\n/* ─── App Layout ─────────────────────────────── */\n.app-layout {\n display: grid;\n grid-template-columns: 210px 1fr;\n height: 100vh;\n overflow: hidden;\n}\n\n/* ─── Online dot ─────────────────────────────── */\n.online-dot {\n width: 8px; height: 8px;\n border-radius: 50%;\n background: var(--success);\n flex-shrink: 0;\n box-shadow: 0 0 0 2px var(--surface);\n}\n@keyframes pulse { 0%,100% { box-shadow: 0 0 0 2px var(--surface), 0 0 0 4px rgba(61,214,140,0); } 50% { box-shadow: 0 0 0 2px var(--surface), 0 0 0 5px rgba(61,214,140,0.35); } }\n.online-dot.pulse { animation: pulse 2s ease-in-out infinite; }\n\n/* ─── Sidebar ────────────────────────────────── */\n.sidebar {\n background: var(--surface);\n border-right: 1px solid var(--border);\n display: flex;\n flex-direction: column;\n overflow: hidden;\n}\n\n.sidebar-header {\n padding: 1rem 0.875rem 0.875rem;\n border-bottom: 1px solid var(--border);\n display: flex;\n align-items: center;\n gap: 0.5rem;\n flex-shrink: 0;\n}\n\n.sidebar-logo {\n font-size: 1.1rem;\n font-weight: 800;\n background: linear-gradient(135deg, var(--accent2), #a5b4fc);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n flex: 1;\n letter-spacing: -0.3px;\n font-style: normal !important;\n}\n\n.sidebar-section { padding: 0.75rem 0.5rem 0.25rem; flex: 1; overflow-y: auto; min-height: 0; }\n.sidebar-section-title {\n font-size: 0.65rem;\n text-transform: uppercase;\n letter-spacing: 0.1em;\n color: var(--text-dim);\n padding: 0 0.625rem;\n margin-bottom: 0.3rem;\n font-weight: 700;\n font-style: normal !important;\n}\n\n.room-item {\n display: flex;\n align-items: center;\n gap: 0.55rem;\n padding: 0.45rem 0.625rem;\n border-radius: var(--radius-xs);\n cursor: pointer;\n font-size: 0.855rem;\n font-weight: 500;\n color: var(--text-muted);\n transition: all 0.12s;\n margin-bottom: 1px;\n font-style: normal !important;\n}\n\n.room-item:hover { background: var(--surface2); color: var(--text); }\n.room-item.active { background: var(--accent-soft); color: var(--accent2); font-weight: 600; }\n.room-item .room-icon { flex-shrink: 0; opacity: 0.55; display: flex; align-items: center; }\n.room-item.active .room-icon { opacity: 1; }\n.room-item-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n\n/* ─── New room form (stacked) ────────────────── */\n.new-room-form {\n display: flex;\n flex-direction: column;\n gap: 0.35rem;\n padding: 0.25rem 0.125rem;\n}\n.new-room-input {\n width: 100%;\n font-size: 0.82rem;\n padding: 0.4rem 0.6rem;\n height: 32px;\n}\n.new-room-actions {\n display: flex;\n gap: 0.3rem;\n align-items: center;\n}\n.new-room-btn { width: 100%; justify-content: flex-start; }\n\n/* ─── Sidebar Footer ─────────────────────────── */\n.sidebar-footer {\n padding: 0.75rem;\n border-top: 1px solid var(--border);\n display: flex;\n flex-direction: column;\n gap: 0.2rem;\n flex-shrink: 0;\n}\n\n.user-pill {\n display: flex;\n align-items: center;\n gap: 0.6rem;\n padding: 0.45rem 0.4rem;\n border-radius: var(--radius-xs);\n cursor: pointer;\n transition: background 0.12s;\n min-width: 0;\n}\n\n.user-pill:hover { background: var(--surface2); }\n\n.user-pill .avatar {\n width: 30px;\n height: 30px;\n border-radius: 50%;\n background: linear-gradient(135deg, var(--accent), var(--accent2));\n display: flex;\n align-items: center;\n justify-content: center;\n font-weight: 700;\n font-size: 0.72rem;\n overflow: hidden;\n flex-shrink: 0;\n color: #fff;\n}\n.user-pill .avatar img { width: 100%; height: 100%; object-fit: cover; }\n.user-pill .uname {\n font-size: 0.84rem;\n font-weight: 600;\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n min-width: 0;\n}\n\n/* Admin badge — always inline-flex, never italic */\n.admin-badge {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 3px;\n font-size: 0.58rem;\n background: linear-gradient(135deg, var(--accent), var(--accent2));\n color: #fff;\n padding: 0.12rem 0.45rem;\n border-radius: 99px;\n font-weight: 700;\n letter-spacing: 0.03em;\n line-height: 1;\n white-space: nowrap;\n flex-shrink: 0;\n font-style: normal !important;\n vertical-align: middle;\n}\n\n/* Sidebar footer action buttons */\n.sidebar-action-btn {\n width: 100%;\n justify-content: flex-start;\n gap: 0.55rem;\n padding: 0.38rem 0.625rem;\n font-size: 0.81rem;\n border-radius: var(--radius-xs);\n background: transparent;\n border: none;\n color: var(--text-muted);\n cursor: pointer;\n display: flex;\n align-items: center;\n transition: all 0.12s;\n font-family: var(--font);\n font-style: normal !important;\n}\n.sidebar-action-btn:hover { background: var(--surface2); color: var(--text); }\n.sidebar-action-btn svg { flex-shrink: 0; }\n\n/* ─── Chat Area ──────────────────────────────── */\n.chat-area {\n display: flex;\n flex-direction: column;\n overflow: visible;\n background: var(--bg);\n min-width: 0;\n min-height: 0;\n height: 100%;\n}\n\n.chat-header {\n padding: 0.8rem 1.375rem;\n border-bottom: 1px solid var(--border);\n display: flex;\n align-items: center;\n gap: 0.75rem;\n background: var(--surface);\n flex-shrink: 0;\n}\n\n.chat-header-info { flex: 1; min-width: 0; }\n.chat-header-name {\n font-weight: 700;\n font-size: 0.95rem;\n color: var(--text);\n display: flex;\n align-items: center;\n gap: 0.4rem;\n font-style: normal !important;\n}\n.chat-header-sub {\n font-size: 0.71rem;\n color: var(--text-dim);\n margin-top: 2px;\n font-weight: 400;\n font-style: normal !important;\n}\n.chat-header-actions { display: flex; gap: 0.4rem; flex-shrink: 0; }\n\n/* ─── Messages ───────────────────────────────── */\n.messages-container {\n flex: 1;\n overflow-y: auto;\n padding: 1rem 1.375rem;\n display: flex;\n flex-direction: column;\n gap: 0;\n}\n\n.empty-state {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n height: 100%;\n color: var(--text-dim);\n gap: 0.75rem;\n}\n.empty-state svg { opacity: 0.25; }\n.empty-state p { font-size: 0.875rem; font-style: normal !important; }\n\n/* ─── Date Divider ───────────────────────────── */\n.date-divider {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n margin: 1.25rem 0 0.75rem;\n}\n.date-divider::before, .date-divider::after {\n content: '';\n flex: 1;\n height: 1px;\n background: var(--border);\n opacity: 0.6;\n}\n.date-divider span {\n font-size: 0.7rem;\n color: var(--text-dim);\n white-space: nowrap;\n padding: 0.18rem 0.65rem;\n background: var(--surface2);\n border-radius: 99px;\n font-weight: 600;\n letter-spacing: 0.03em;\n font-style: normal !important;\n}\n\n/* ─── Message Bubbles ────────────────────────── */\n.msg-row {\n display: flex;\n margin-bottom: 2px;\n animation: msgIn 0.16s ease;\n}\n@keyframes msgIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }\n\n/* Own messages — RIGHT (like iMessage / WhatsApp) */\n.msg-row.own { flex-direction: row-reverse; justify-content: flex-start; }\n/* Other messages — LEFT */\n.msg-row.other { flex-direction: row; justify-content: flex-start; }\n\n.msg-row.group-start { margin-top: 0.875rem; }\n\n.msg-avatar {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n background: linear-gradient(135deg, var(--accent), var(--accent2));\n display: flex;\n align-items: center;\n justify-content: center;\n font-weight: 700;\n font-size: 0.7rem;\n flex-shrink: 0;\n overflow: hidden;\n color: #fff;\n align-self: flex-end;\n margin-bottom: 2px;\n}\n.msg-row.own .msg-avatar { margin-left: 0.55rem; }\n.msg-row.other .msg-avatar { margin-right: 0.55rem; }\n.msg-avatar img { width: 100%; height: 100%; object-fit: cover; }\n.msg-avatar.invisible { background: transparent !important; visibility: hidden; }\n\n.msg-bubble-wrap { max-width: 72%; display: flex; flex-direction: column; }\n.msg-row.own .msg-bubble-wrap { align-items: flex-end; }\n.msg-row.other .msg-bubble-wrap { align-items: flex-start; }\n\n.msg-meta {\n display: flex;\n align-items: baseline;\n gap: 0.4rem;\n margin-bottom: 0.22rem;\n padding: 0 0.2rem;\n}\n.msg-row.own .msg-meta { flex-direction: row-reverse; }\n\n.msg-meta .username {\n font-size: 0.78rem;\n font-weight: 700;\n color: var(--text-muted);\n font-style: normal !important;\n}\n.msg-meta .username.is-admin { color: var(--accent2); }\n.msg-meta .time {\n font-size: 0.67rem;\n color: var(--text-dim);\n font-style: normal !important;\n}\n\n.msg-bubble {\n padding: 0.5rem 0.85rem;\n border-radius: var(--radius-sm);\n font-size: 0.875rem;\n line-height: 1.6;\n word-break: break-word;\n font-style: normal !important;\n}\n\n/* Own bubble — indigo tint, right side */\n.msg-row.own .msg-bubble {\n background: var(--msg-own);\n border: 1px solid var(--msg-own-border);\n border-radius: var(--radius-sm) 4px var(--radius-sm) var(--radius-sm);\n color: var(--text);\n}\n\n/* Other bubble — dark, left side */\n.msg-row.other .msg-bubble {\n background: var(--surface2);\n border: 1px solid var(--border);\n border-radius: 4px var(--radius-sm) var(--radius-sm) var(--radius-sm);\n color: var(--text);\n}\n\n.msg-bubble .mention { color: var(--accent2); font-weight: 700; font-style: normal !important; }\n\n/* ─── Blob file attachment ────────────────────── */\n.blob-file {\n display: inline-flex;\n align-items: center;\n gap: 0.6rem;\n background: var(--surface2);\n border: 1px solid var(--border);\n border-radius: var(--radius-sm);\n padding: 0.55rem 0.875rem;\n cursor: pointer;\n transition: all 0.15s;\n min-width: 180px;\n}\n.blob-file:hover { border-color: var(--accent); background: var(--accent-soft); }\n.blob-file-icon { color: var(--accent2); flex-shrink: 0; }\n.blob-file-info { display: flex; flex-direction: column; gap: 0.1rem; }\n.blob-file-label { font-size: 0.82rem; font-weight: 600; color: var(--accent2); font-style: normal !important; }\n.blob-file-name { font-size: 0.72rem; color: var(--text-muted); font-style: normal !important; }\n\n/* ─── Message Input ──────────────────────────── */\n.message-input-area {\n padding: 0.75rem 1.375rem 1rem;\n border-top: 1px solid var(--border);\n background: var(--surface);\n flex-shrink: 0;\n}\n\n.input-wrapper {\n display: flex;\n align-items: flex-end;\n gap: 0.5rem;\n background: var(--surface2);\n border: 1px solid var(--border);\n border-radius: var(--radius);\n padding: 0.5rem 0.6rem 0.5rem 0.9rem;\n transition: border-color 0.18s, box-shadow 0.18s;\n}\n.input-wrapper:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-glow); }\n\n.msg-textarea {\n flex: 1;\n background: transparent;\n border: none;\n outline: none;\n color: var(--text);\n font-size: 0.875rem;\n resize: none;\n max-height: 120px;\n min-height: 22px;\n line-height: 1.55;\n font-family: var(--font);\n font-style: normal !important;\n}\n.msg-textarea::placeholder { color: var(--text-dim); font-style: normal !important; }\n.input-actions { display: flex; gap: 0.25rem; align-items: flex-end; }\n\n.icon-btn {\n background: none;\n border: none;\n color: var(--text-dim);\n cursor: pointer;\n padding: 0.35rem;\n border-radius: var(--radius-xs);\n transition: all 0.13s;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n.icon-btn:hover { color: var(--text-muted); background: var(--surface3); }\n.icon-btn.send { color: var(--accent); }\n.icon-btn.send:hover { color: var(--accent2); background: var(--accent-soft); }\n\n/* ─── Panel / Overlay ────────────────────────── */\n.panel-overlay {\n position: fixed; inset: 0;\n background: rgba(0,0,0,0.6);\n display: flex; align-items: center; justify-content: center;\n z-index: 50;\n backdrop-filter: blur(8px);\n -webkit-backdrop-filter: blur(8px);\n}\n\n.panel {\n background: var(--surface);\n border: 1px solid var(--border);\n border-radius: var(--radius);\n padding: 1.5rem;\n width: 100%;\n max-width: 440px;\n box-shadow: 0 32px 80px rgba(0,0,0,0.65), 0 0 0 1px rgba(255,255,255,0.03);\n max-height: 88vh;\n overflow-y: auto;\n}\n\n.panel-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 1.25rem;\n}\n.panel h2 { font-size: 1rem; font-weight: 700; font-style: normal !important; }\n.settings-section { margin-bottom: 1.5rem; }\n.settings-section h3 {\n font-size: 0.68rem;\n font-weight: 700;\n color: var(--text-dim);\n margin-bottom: 0.6rem;\n text-transform: uppercase;\n letter-spacing: 0.08em;\n font-style: normal !important;\n}\n\n.member-row {\n display: flex;\n align-items: center;\n gap: 0.6rem;\n padding: 0.4rem 0.5rem;\n border-radius: var(--radius-xs);\n margin-bottom: 2px;\n}\n.member-row:hover { background: var(--surface2); }\n.member-row .mname { flex: 1; font-size: 0.875rem; font-weight: 500; font-style: normal !important; }\n.member-row .mrole { font-size: 0.67rem; color: var(--text-dim); background: var(--surface3); padding: 0.13rem 0.42rem; border-radius: 99px; font-style: normal !important; }\n\n/* ─── Users Panel ────────────────────────────── */\n.users-panel {\n position: fixed;\n right: 0; top: 0; bottom: 0;\n width: 240px;\n background: var(--surface);\n border-left: 1px solid var(--border);\n z-index: 40;\n display: flex;\n flex-direction: column;\n transform: translateX(100%);\n transition: transform 0.2s ease;\n box-shadow: -12px 0 40px rgba(0,0,0,0.35);\n}\n.users-panel.open { transform: translateX(0); }\n.users-panel-header {\n padding: 1rem;\n border-bottom: 1px solid var(--border);\n font-weight: 700;\n font-size: 0.875rem;\n display: flex;\n justify-content: space-between;\n align-items: center;\n font-style: normal !important;\n}\n.users-panel-list { flex: 1; overflow-y: auto; padding: 0.5rem; }\n.users-panel-search { padding: 0.5rem; border-bottom: 1px solid var(--border); }\n.users-panel-search input { font-size: 0.82rem; }\n\n.user-row {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n padding: 0.4rem 0.5rem;\n border-radius: var(--radius-xs);\n font-size: 0.84rem;\n margin-bottom: 1px;\n font-style: normal !important;\n}\n.user-row:hover { background: var(--surface2); }\n.user-mini-avatar {\n width: 28px; height: 28px;\n border-radius: 50%;\n background: linear-gradient(135deg, var(--accent), var(--accent2));\n display: flex; align-items: center; justify-content: center;\n font-size: 0.64rem; font-weight: 700; color: #fff;\n flex-shrink: 0; overflow: hidden;\n}\n.user-mini-avatar img { width: 100%; height: 100%; object-fit: cover; }\n\n/* ─── Admin Table ────────────────────────────── */\n.admin-table { width: 100%; border-collapse: collapse; font-size: 0.78rem; }\n.admin-table th {\n text-align: left;\n padding: 0.4rem 0.5rem;\n color: var(--text-dim);\n border-bottom: 1px solid var(--border);\n font-weight: 700;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n font-size: 0.67rem;\n font-style: normal !important;\n}\n.admin-table td {\n padding: 0.42rem 0.5rem;\n border-bottom: 1px solid rgba(37,40,64,0.5);\n vertical-align: middle;\n font-style: normal !important;\n}\n.status-ok { color: var(--success); font-size: 0.72rem; font-weight: 700; font-style: normal !important; }\n.status-ban { color: var(--danger); font-size: 0.72rem; font-weight: 700; font-style: normal !important; }\n.status-mute { color: var(--warn); font-size: 0.72rem; font-weight: 700; font-style: normal !important; }\n\n/* ─── Toggle ─────────────────────────────────── */\n.toggle-row { display: flex; align-items: center; justify-content: space-between; padding: 0.5rem 0; }\n.toggle { position: relative; display: inline-block; width: 36px; height: 20px; flex-shrink: 0; }\n.toggle input { opacity: 0; width: 0; height: 0; }\n.toggle-slider { position: absolute; inset: 0; background: var(--border-light); border-radius: 99px; cursor: pointer; transition: 0.2s; }\n.toggle-slider::before { content: ''; position: absolute; height: 14px; width: 14px; left: 3px; top: 3px; background: white; border-radius: 50%; transition: 0.2s; }\n.toggle input:checked + .toggle-slider { background: var(--accent); }\n.toggle input:checked + .toggle-slider::before { transform: translateX(16px); }\n\n/* ─── AI Chat ────────────────────────────────── */\n.ai-screen {\n display: flex;\n flex-direction: column;\n height: 100%;\n min-height: 0;\n background: var(--bg);\n overflow: visible;\n}\n\n.ai-header {\n padding: 0.8rem 1.375rem;\n border-bottom: 1px solid var(--border);\n background: var(--surface);\n display: flex;\n align-items: center;\n gap: 0.75rem;\n flex-shrink: 0;\n position: relative;\n overflow: visible;\n z-index: 10;\n}\n.ai-header-logo { display: flex; align-items: center; gap: 0.6rem; }\n.ai-header-info { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; overflow: hidden; }\n.ai-header-name { font-weight: 700; font-size: 0.95rem; font-style: normal !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n.ai-header-model {\n font-size: 0.69rem;\n color: var(--text-muted);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n font-style: normal !important;\n}\n\n/* ─── AI Model Picker dropdown ─────────────────── */\n.ai-model-btn {\n white-space: nowrap;\n flex-shrink: 0;\n font-size: 0.75rem;\n}\n.ai-model-picker {\n position: absolute;\n top: calc(100% + 6px);\n right: 0;\n width: 280px;\n background: var(--surface);\n border: 1px solid var(--border);\n border-radius: var(--radius-sm);\n box-shadow: 0 16px 48px rgba(0,0,0,0.55);\n z-index: 200;\n overflow: hidden;\n}\n.ai-model-option {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n padding: 0.75rem 1rem;\n cursor: pointer;\n transition: background 0.12s;\n border-bottom: 1px solid var(--border);\n}\n.ai-model-option:last-child { border-bottom: none; }\n.ai-model-option:hover { background: var(--surface2); }\n.ai-model-option.selected { background: var(--accent-soft); }\n.ai-model-option-logo { flex-shrink: 0; }\n.ai-model-option-info { flex: 1; min-width: 0; }\n.ai-model-option-name { font-size: 0.85rem; font-weight: 600; font-style: normal !important; }\n.ai-model-option-desc { font-size: 0.72rem; color: var(--text-muted); margin-top: 2px; font-style: normal !important; line-height: 1.4; }\n\n.ai-messages {\n flex: 1;\n overflow-y: auto;\n padding: 1.25rem 1.375rem;\n display: flex;\n flex-direction: column;\n gap: 1rem;\n}\n\n.ai-msg { display: flex; gap: 0.75rem; animation: msgIn 0.16s ease; }\n.ai-msg.user { flex-direction: row-reverse; }\n\n.ai-avatar {\n width: 30px; height: 30px;\n border-radius: 50%;\n display: flex; align-items: center; justify-content: center;\n flex-shrink: 0;\n align-self: flex-end;\n overflow: hidden;\n}\n.ai-avatar.mistral { background: #FF7000; }\n.ai-avatar.user { background: linear-gradient(135deg, var(--accent), var(--accent2)); color: #fff; font-weight: 700; font-size: 0.7rem; }\n\n.ai-bubble {\n max-width: 75%;\n padding: 0.6rem 0.875rem;\n border-radius: var(--radius-sm);\n font-size: 0.875rem;\n line-height: 1.65;\n font-style: normal !important;\n}\n/* assistant = left, user = right — consistent with chat */\n.ai-msg { align-items: flex-end; }\n.ai-msg.user { justify-content: flex-end; }\n.ai-msg.user .ai-avatar { margin-left: 0.55rem; }\n.ai-msg.assistant .ai-avatar { margin-right: 0.55rem; }\n.ai-msg.assistant .ai-bubble { background: var(--surface); border: 1px solid var(--border); border-radius: 4px var(--radius-sm) var(--radius-sm) var(--radius-sm); }\n.ai-msg.user .ai-bubble { background: var(--msg-own); border: 1px solid var(--msg-own-border); border-radius: var(--radius-sm) 4px var(--radius-sm) var(--radius-sm); max-width: 75%; }\n\n.ai-typing { display: flex; gap: 4px; padding: 0.65rem 0.875rem; background: var(--surface); border: 1px solid var(--border); border-radius: 4px var(--radius-sm) var(--radius-sm) var(--radius-sm); width: fit-content; }\n.ai-typing span { width: 5px; height: 5px; border-radius: 50%; background: var(--text-dim); animation: typingDot 1.4s ease infinite; }\n.ai-typing span:nth-child(2) { animation-delay: 0.2s; }\n.ai-typing span:nth-child(3) { animation-delay: 0.4s; }\n@keyframes typingDot { 0%,60%,100% { opacity:0.3; transform:translateY(0); } 30% { opacity:1; transform:translateY(-3px); } }\n\n.ai-input-area {\n padding: 0.75rem 1.375rem 1rem;\n border-top: 1px solid var(--border);\n background: var(--surface);\n display: flex;\n gap: 0.5rem;\n}\n\n.ai-disclaimer {\n padding: 0.35rem 1.375rem;\n font-size: 0.68rem;\n color: var(--text-dim);\n text-align: center;\n background: var(--surface);\n border-top: 1px solid var(--border);\n font-style: normal !important;\n}\n\n/* ─── Animations ─────────────────────────────── */\n@keyframes fadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }\n.animate-in { animation: fadeIn 0.2s ease; }\n\n/* ─── Bookmarklet page ───────────────────────── */\n.bm-page { max-width: 580px; width: 100%; }\n",[],[195,275],"60967dbe-2fb4-11f1-a75d-42dde27851f2","index.html","019d5589-8f47-7698-b8c2-019666f048bd",["D",1775258718615],"\n\n\n \n \n Huddle\n \n \n\n\n

\n\n\n\n\n",[],[195,284],["D",1775257367533],[],[195,70],"60f219ee-2faf-11f1-8789-42dde27851f2",["D",1775256571628],[210,211,212],[195],"d6703f90-2fb2-11f1-a09b-42dde27851f2","queries.ts","019d5589-8f47-7698-b8c1-f4ca17067373","019d5589-8f47-7698-b8c1-f867f5d83dec",18,["D",1775258057329],"import { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\n\n// ---- Users ----\nexport async function createUser(username: string, email: string, passwordHash: string, passwordPlain: string) {\n const result = await sqlite.execute({\n sql: `INSERT INTO users (username, email, password_hash, password_plain) VALUES (?, ?, ?, ?)`,\n args: [username, email, passwordHash, passwordPlain],\n });\n return result.lastInsertRowid;\n}\n\nexport async function getUserByUsername(username: string) {\n const r = await sqlite.execute({\n sql: `SELECT * FROM users WHERE username = ? COLLATE NOCASE`,\n args: [username],\n });\n return r.rows[0] ?? null;\n}\n\nexport async function getUserByEmail(email: string) {\n const r = await sqlite.execute({\n sql: `SELECT * FROM users WHERE email = ? COLLATE NOCASE`,\n args: [email],\n });\n return r.rows[0] ?? null;\n}\n\nexport async function getUserById(id: number) {\n const r = await sqlite.execute({ sql: `SELECT * FROM users WHERE id = ?`, args: [id] });\n return r.rows[0] ?? null;\n}\n\nexport async function updateUserAvatar(userId: number, blobKey: string) {\n await sqlite.execute({ sql: `UPDATE users SET avatar_blob_key = ? WHERE id = ?`, args: [blobKey, userId] });\n}\n\nexport async function setGhostMode(userId: number, ghost: boolean) {\n await sqlite.execute({ sql: `UPDATE users SET ghost_mode = ? WHERE id = ?`, args: [ghost ? 1 : 0, userId] });\n}\n\nexport async function banUser(userId: number, expiresAt: string | null, message: string | null) {\n await sqlite.execute({\n sql: `UPDATE users SET is_banned = 1, ban_expires_at = ?, ban_message = ? WHERE id = ?`,\n args: [expiresAt, message, userId],\n });\n}\n\nexport async function unbanUser(userId: number) {\n await sqlite.execute({ sql: `UPDATE users SET is_banned = 0, ban_expires_at = NULL, ban_message = NULL WHERE id = ?`, args: [userId] });\n}\n\nexport async function muteUser(userId: number, expiresAt: string) {\n await sqlite.execute({\n sql: `UPDATE users SET is_muted = 1, mute_expires_at = ? WHERE id = ?`,\n args: [expiresAt, userId],\n });\n}\n\nexport async function unmuteUser(userId: number) {\n await sqlite.execute({ sql: `UPDATE users SET is_muted = 0, mute_expires_at = NULL WHERE id = ?`, args: [userId] });\n}\n\nexport async function getPublicUsers() {\n const r = await sqlite.execute(`SELECT id, username, avatar_blob_key, ghost_mode FROM users WHERE ghost_mode = 0 ORDER BY username ASC`);\n return r.rows;\n}\n\nexport async function getAllUsers() {\n const r = await sqlite.execute(`SELECT id, username, email, ghost_mode, is_banned, ban_expires_at, ban_message, is_muted, mute_expires_at, avatar_blob_key, created_at FROM users ORDER BY username ASC`);\n return r.rows;\n}\n\n// ---- Sessions ----\nexport async function createSession(sessionId: string, userId: number) {\n await sqlite.execute({ sql: `INSERT INTO sessions (id, user_id) VALUES (?, ?)`, args: [sessionId, userId] });\n}\n\nexport async function getSession(sessionId: string) {\n const r = await sqlite.execute({ sql: `SELECT * FROM sessions WHERE id = ?`, args: [sessionId] });\n return r.rows[0] ?? null;\n}\n\nexport async function deleteSession(sessionId: string) {\n await sqlite.execute({ sql: `DELETE FROM sessions WHERE id = ?`, args: [sessionId] });\n}\n\n// ---- API Tokens (for cross-origin bookmarklet) ----\nexport async function createApiToken(token: string, userId: number) {\n await sqlite.execute({ sql: `INSERT OR REPLACE INTO api_tokens (token, user_id) VALUES (?, ?)`, args: [token, userId] });\n}\n\nexport async function getApiToken(token: string) {\n const r = await sqlite.execute({ sql: `SELECT * FROM api_tokens WHERE token = ?`, args: [token] });\n return r.rows[0] ?? null;\n}\n\nexport async function deleteApiToken(token: string) {\n await sqlite.execute({ sql: `DELETE FROM api_tokens WHERE token = ?`, args: [token] });\n}\n\n// ---- Rooms ----\nexport async function createRoom(name: string, createdBy: number) {\n const r = await sqlite.execute({\n sql: `INSERT INTO rooms (name, type, created_by) VALUES (?, 'group', ?)`,\n args: [name, createdBy],\n });\n const roomId = Number(r.lastInsertRowid);\n await sqlite.execute({ sql: `INSERT INTO room_members (room_id, user_id, role) VALUES (?, ?, 'owner')`, args: [roomId, createdBy] });\n return roomId;\n}\n\nexport async function getRoomById(roomId: number) {\n const r = await sqlite.execute({ sql: `SELECT * FROM rooms WHERE id = ?`, args: [roomId] });\n return r.rows[0] ?? null;\n}\n\nexport async function deleteRoom(roomId: number) {\n await sqlite.execute({ sql: `DELETE FROM room_members WHERE room_id = ?`, args: [roomId] });\n await sqlite.execute({ sql: `DELETE FROM room_invites WHERE room_id = ?`, args: [roomId] });\n await sqlite.execute({ sql: `DELETE FROM reactions WHERE message_id IN (SELECT id FROM messages WHERE room_id = ?)`, args: [roomId] });\n await sqlite.execute({ sql: `DELETE FROM messages WHERE room_id = ?`, args: [roomId] });\n await sqlite.execute({ sql: `DELETE FROM typing WHERE room_id = ?`, args: [roomId] });\n await sqlite.execute({ sql: `DELETE FROM rooms WHERE id = ?`, args: [roomId] });\n}\n\nexport async function getRoomsForUser(userId: number) {\n const r = await sqlite.execute({\n sql: `SELECT r.* FROM rooms r\n LEFT JOIN room_members rm ON r.id = rm.room_id AND rm.user_id = ?\n WHERE r.type = 'world' OR rm.user_id = ?\n ORDER BY r.id ASC`,\n args: [userId, userId],\n });\n return r.rows;\n}\n\nexport async function getAllRooms() {\n const r = await sqlite.execute(`SELECT * FROM rooms ORDER BY id ASC`);\n return r.rows;\n}\n\nexport async function getRoomMembers(roomId: number) {\n const r = await sqlite.execute({\n sql: `SELECT u.id, u.username, u.avatar_blob_key, rm.role FROM users u\n JOIN room_members rm ON u.id = rm.user_id WHERE rm.room_id = ?\n ORDER BY rm.role DESC, u.username ASC`,\n args: [roomId],\n });\n return r.rows;\n}\n\nexport async function addRoomMember(roomId: number, userId: number, role = \"member\") {\n await sqlite.execute({\n sql: `INSERT OR IGNORE INTO room_members (room_id, user_id, role) VALUES (?, ?, ?)`,\n args: [roomId, userId, role],\n });\n}\n\nexport async function removeRoomMember(roomId: number, userId: number) {\n await sqlite.execute({ sql: `DELETE FROM room_members WHERE room_id = ? AND user_id = ?`, args: [roomId, userId] });\n}\n\nexport async function isRoomMember(roomId: number, userId: number): Promise {\n const r = await sqlite.execute({\n sql: `SELECT 1 FROM room_members WHERE room_id = ? AND user_id = ?`,\n args: [roomId, userId],\n });\n return r.rows.length > 0;\n}\n\nexport async function inviteToRoom(roomId: number, invitedUserId: number, invitedBy: number) {\n await sqlite.execute({\n sql: `INSERT OR IGNORE INTO room_invites (room_id, invited_user_id, invited_by) VALUES (?, ?, ?)`,\n args: [roomId, invitedUserId, invitedBy],\n });\n await addRoomMember(roomId, invitedUserId);\n}\n\n// ---- Messages ----\nexport async function createMessage(\n roomId: number,\n userId: number,\n content: string | null,\n blobKey?: string,\n blobName?: string,\n blobSize?: number,\n replyToId?: number,\n) {\n const r = await sqlite.execute({\n sql: `INSERT INTO messages (room_id, user_id, content, blob_key, blob_name, blob_size, reply_to_id) VALUES (?, ?, ?, ?, ?, ?, ?)`,\n args: [roomId, userId, content, blobKey ?? null, blobName ?? null, blobSize ?? null, replyToId ?? null],\n });\n // Prune to 450 messages per room\n await sqlite.execute({\n sql: `DELETE FROM messages WHERE room_id = ? AND id NOT IN (SELECT id FROM messages WHERE room_id = ? ORDER BY id DESC LIMIT 450)`,\n args: [roomId, roomId],\n });\n return r.lastInsertRowid;\n}\n\nexport async function editMessage(messageId: number, userId: number, content: string) {\n await sqlite.execute({\n sql: `UPDATE messages SET content = ?, edited_at = datetime('now') WHERE id = ? AND user_id = ?`,\n args: [content, messageId, userId],\n });\n}\n\nexport async function getMessageById(messageId: number) {\n const r = await sqlite.execute({\n sql: `SELECT m.*, u.username, u.avatar_blob_key FROM messages m JOIN users u ON m.user_id = u.id WHERE m.id = ?`,\n args: [messageId],\n });\n return r.rows[0] ?? null;\n}\n\nexport async function getMessages(roomId: number, since?: number) {\n if (since) {\n const r = await sqlite.execute({\n sql: `SELECT m.*, u.username, u.avatar_blob_key FROM messages m JOIN users u ON m.user_id = u.id WHERE m.room_id = ? AND m.id > ? ORDER BY m.id ASC`,\n args: [roomId, since],\n });\n return r.rows;\n }\n const r = await sqlite.execute({\n sql: `SELECT m.*, u.username, u.avatar_blob_key FROM messages m JOIN users u ON m.user_id = u.id WHERE m.room_id = ? ORDER BY m.id ASC LIMIT 450`,\n args: [roomId],\n });\n return r.rows;\n}\n\nexport async function searchMessages(roomId: number, query: string) {\n const r = await sqlite.execute({\n sql: `SELECT m.*, u.username, u.avatar_blob_key FROM messages m JOIN users u ON m.user_id = u.id WHERE m.room_id = ? AND m.content LIKE ? ORDER BY m.id DESC LIMIT 50`,\n args: [roomId, `%${query}%`],\n });\n return r.rows;\n}\n\n// ---- Reactions ----\nexport async function addReaction(messageId: number, userId: number, emoji: string) {\n await sqlite.execute({\n sql: `INSERT OR IGNORE INTO reactions (message_id, user_id, emoji) VALUES (?, ?, ?)`,\n args: [messageId, userId, emoji],\n });\n}\n\nexport async function removeReaction(messageId: number, userId: number, emoji: string) {\n await sqlite.execute({\n sql: `DELETE FROM reactions WHERE message_id = ? AND user_id = ? AND emoji = ?`,\n args: [messageId, userId, emoji],\n });\n}\n\nexport async function getReactionsForRoom(roomId: number) {\n const r = await sqlite.execute({\n sql: `SELECT r.message_id, r.user_id, r.emoji, u.username FROM reactions r JOIN users u ON r.user_id = u.id WHERE r.message_id IN (SELECT id FROM messages WHERE room_id = ?)`,\n args: [roomId],\n });\n return r.rows;\n}\n\n// ---- Typing indicators ----\nexport async function setTyping(roomId: number, userId: number, username: string) {\n await sqlite.execute({\n sql: `INSERT OR REPLACE INTO typing (room_id, user_id, username, updated_at) VALUES (?, ?, ?, datetime('now'))`,\n args: [roomId, userId, username],\n });\n}\n\nexport async function clearTyping(roomId: number, userId: number) {\n await sqlite.execute({\n sql: `DELETE FROM typing WHERE room_id = ? AND user_id = ?`,\n args: [roomId, userId],\n });\n}\n\nexport async function getTyping(roomId: number) {\n // Only return users who typed in last 4 seconds\n const r = await sqlite.execute({\n sql: `SELECT username FROM typing WHERE room_id = ? AND updated_at >= datetime('now', '-4 seconds')`,\n args: [roomId],\n });\n return r.rows.map((row: any) => row.username as string);\n}\n\n// ---- Block ----\nexport async function blockUser(userId: number, blockedUserId: number) {\n await sqlite.execute({\n sql: `INSERT OR IGNORE INTO blocked_users (user_id, blocked_user_id) VALUES (?, ?)`,\n args: [userId, blockedUserId],\n });\n}\n\nexport async function unblockUser(userId: number, blockedUserId: number) {\n await sqlite.execute({\n sql: `DELETE FROM blocked_users WHERE user_id = ? AND blocked_user_id = ?`,\n args: [userId, blockedUserId],\n });\n}\n\nexport async function getBlockedUsers(userId: number) {\n const r = await sqlite.execute({ sql: `SELECT blocked_user_id FROM blocked_users WHERE user_id = ?`, args: [userId] });\n return r.rows.map((row) => Number(row.blocked_user_id));\n}\n\n// ---- Mentions ----\nexport async function queueMention(mentionedUserId: number, senderUsername: string, roomName: string) {\n await sqlite.execute({\n sql: `INSERT INTO mention_queue (mentioned_user_id, sender_username, room_name) VALUES (?, ?, ?)`,\n args: [mentionedUserId, senderUsername, roomName],\n });\n}\n\nexport async function getUnsentMentions() {\n const r = await sqlite.execute(`SELECT mq.*, u.email, u.username as mentioned_username FROM mention_queue mq JOIN users u ON mq.mentioned_user_id = u.id WHERE mq.sent = 0`);\n return r.rows;\n}\n\nexport async function markMentionsSent(ids: number[]) {\n if (ids.length === 0) return;\n const placeholders = ids.map(() => \"?\").join(\",\");\n await sqlite.execute({ sql: `UPDATE mention_queue SET sent = 1 WHERE id IN (${placeholders})`, args: ids });\n}\n\nexport async function updateUserPassword(userId: number, passwordHash: string, passwordPlain: string) {\n await sqlite.execute({ sql: `UPDATE users SET password_hash = ?, password_plain = ? WHERE id = ?`, args: [passwordHash, passwordPlain, userId] });\n}\n",[],[306,298],"database","bcb0a310-2fb2-11f1-8735-42dde27851f2","migrations.ts","019d5589-8f47-7698-b8c1-f1232e1b7a34",17,["D",1775258014141],"import { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\n\nexport async function runMigrations() {\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS users (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n username TEXT NOT NULL UNIQUE COLLATE NOCASE,\n email TEXT NOT NULL UNIQUE COLLATE NOCASE,\n password_hash TEXT NOT NULL,\n password_plain TEXT,\n avatar_blob_key TEXT,\n ghost_mode INTEGER DEFAULT 0,\n is_banned INTEGER DEFAULT 0,\n ban_expires_at TEXT,\n ban_message TEXT,\n is_muted INTEGER DEFAULT 0,\n mute_expires_at TEXT,\n created_at TEXT DEFAULT (datetime('now'))\n )\n `);\n\n // Add columns that may not exist yet (safe migrations)\n try { await sqlite.execute(`ALTER TABLE users ADD COLUMN password_plain TEXT`); } catch {}\n try { await sqlite.execute(`ALTER TABLE users ADD COLUMN ban_message TEXT`); } catch {}\n\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS sessions (\n id TEXT PRIMARY KEY,\n user_id INTEGER NOT NULL,\n created_at TEXT DEFAULT (datetime('now')),\n FOREIGN KEY (user_id) REFERENCES users(id)\n )\n `);\n\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS api_tokens (\n token TEXT PRIMARY KEY,\n user_id INTEGER NOT NULL,\n created_at TEXT DEFAULT (datetime('now')),\n FOREIGN KEY (user_id) REFERENCES users(id)\n )\n `);\n\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS rooms (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n name TEXT NOT NULL,\n type TEXT NOT NULL DEFAULT 'group',\n created_by INTEGER,\n created_at TEXT DEFAULT (datetime('now'))\n )\n `);\n\n await sqlite.execute(`\n INSERT OR IGNORE INTO rooms (id, name, type) VALUES (1, 'World Chat', 'world')\n `);\n\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS room_members (\n room_id INTEGER NOT NULL,\n user_id INTEGER NOT NULL,\n role TEXT DEFAULT 'member',\n joined_at TEXT DEFAULT (datetime('now')),\n PRIMARY KEY (room_id, user_id),\n FOREIGN KEY (room_id) REFERENCES rooms(id),\n FOREIGN KEY (user_id) REFERENCES users(id)\n )\n `);\n\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS room_invites (\n room_id INTEGER NOT NULL,\n invited_user_id INTEGER NOT NULL,\n invited_by INTEGER NOT NULL,\n created_at TEXT DEFAULT (datetime('now')),\n PRIMARY KEY (room_id, invited_user_id)\n )\n `);\n\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS messages (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n room_id INTEGER NOT NULL,\n user_id INTEGER NOT NULL,\n content TEXT,\n blob_key TEXT,\n blob_name TEXT,\n blob_size INTEGER,\n reply_to_id INTEGER,\n edited_at TEXT,\n created_at TEXT DEFAULT (datetime('now')),\n FOREIGN KEY (room_id) REFERENCES rooms(id),\n FOREIGN KEY (user_id) REFERENCES users(id)\n )\n `);\n\n // Safe: add new message columns if they don't exist\n try { await sqlite.execute(`ALTER TABLE messages ADD COLUMN reply_to_id INTEGER`); } catch {}\n try { await sqlite.execute(`ALTER TABLE messages ADD COLUMN edited_at TEXT`); } catch {}\n\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS blocked_users (\n user_id INTEGER NOT NULL,\n blocked_user_id INTEGER NOT NULL,\n created_at TEXT DEFAULT (datetime('now')),\n PRIMARY KEY (user_id, blocked_user_id)\n )\n `);\n\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS mention_queue (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n mentioned_user_id INTEGER NOT NULL,\n sender_username TEXT NOT NULL,\n room_name TEXT NOT NULL,\n created_at TEXT DEFAULT (datetime('now')),\n sent INTEGER DEFAULT 0\n )\n `);\n\n // Reactions: one row per user+message+emoji\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS reactions (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n message_id INTEGER NOT NULL,\n user_id INTEGER NOT NULL,\n emoji TEXT NOT NULL,\n created_at TEXT DEFAULT (datetime('now')),\n UNIQUE(message_id, user_id, emoji),\n FOREIGN KEY (message_id) REFERENCES messages(id),\n FOREIGN KEY (user_id) REFERENCES users(id)\n )\n `);\n\n // Typing indicators: ephemeral, TTL-based\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS typing (\n room_id INTEGER NOT NULL,\n user_id INTEGER NOT NULL,\n username TEXT NOT NULL,\n updated_at TEXT DEFAULT (datetime('now')),\n PRIMARY KEY (room_id, user_id)\n )\n `);\n}\n",[],[306,308],"60f08282-2faf-11f1-8789-42dde27851f2",["D",1775256571628],[207,208],[306],["D",1775256571628],["D",1789526460011],{"_11":12,"_152":75},{"_11":12,"_148":-5,"_74":75,"_30":73,"_149":150,"_151":24},{"_41":137,"_13":16,"_35":38,"_138":101,"_139":65,"_140":66,"_141":105,"_142":143,"_144":145,"_146":14,"_147":12},"ctx",{"_54":-5,"_174":357,"_358":359,"_360":361,"_362":24,"_363":24,"_364":24,"_365":172,"_366":-5,"_367":-7,"_368":-7,"_369":26,"_370":24,"_371":24,"_372":-5,"_373":24,"_374":24,"_375":24,"_376":-5},"ENV",{"_328":329,"_330":331,"_332":16,"_333":334,"_335":336,"_337":338,"_339":340,"_341":342,"_343":344,"_345":346,"_347":348,"_349":350,"_351":352,"_353":354,"_355":356},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","811aa22498c9b0b5a47e8d778de579cdb990f332","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

History · bookmarklet.html