Kikko Bookmarklet

Open Kikko 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 — Kikko 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 Kikko.\n

\n\n

\n\n \n\n ← Back to Kikko\n

\n\n\n\n","label",[165,67],"frontend","pulls","branches","forks","envVars",{"_173":26,"_175":26},"connections",{"_173":26,"_174":26},"count","unfilledCount","emptyCount",{"_32":323,"_13":315,"_65":310,"_42":-5,"_34":35,"_158":39,"_159":144,"_36":324,"_38":26,"_68":238,"_161":-5,"_69":24,"_163":-5,"_201":325,"_17":326},{"_32":316,"_13":317,"_65":318,"_42":310,"_34":35,"_158":39,"_159":144,"_36":319,"_38":26,"_68":217,"_161":320,"_69":24,"_163":-5,"_201":321,"_17":322},{"_32":307,"_13":308,"_65":309,"_42":310,"_34":35,"_158":39,"_159":144,"_36":311,"_38":26,"_68":217,"_161":312,"_69":24,"_163":-5,"_201":313,"_17":314},{"_32":303,"_13":165,"_65":157,"_42":-5,"_34":35,"_158":39,"_159":144,"_36":304,"_38":26,"_68":238,"_161":-5,"_69":24,"_163":-5,"_201":305,"_17":306},{"_32":299,"_13":290,"_65":284,"_42":157,"_34":35,"_158":267,"_159":144,"_36":300,"_38":26,"_68":238,"_161":-5,"_69":24,"_163":-5,"_201":301,"_17":302},{"_32":291,"_13":292,"_65":293,"_42":284,"_34":35,"_158":294,"_159":144,"_36":295,"_38":26,"_68":217,"_161":296,"_69":24,"_163":-5,"_201":297,"_17":298},{"_32":281,"_13":282,"_65":283,"_42":284,"_34":35,"_158":285,"_159":144,"_36":286,"_38":26,"_68":217,"_161":287,"_69":24,"_163":-5,"_201":288,"_17":289},{"_32":156,"_13":67,"_65":66,"_42":157,"_34":35,"_158":39,"_159":144,"_36":278,"_38":26,"_68":21,"_161":162,"_69":24,"_163":-5,"_201":279,"_17":280},{"_32":270,"_13":271,"_65":272,"_42":157,"_34":35,"_158":273,"_159":144,"_36":274,"_38":26,"_68":217,"_161":275,"_69":24,"_163":-5,"_201":276,"_17":277},{"_32":263,"_13":264,"_65":265,"_42":157,"_34":35,"_158":109,"_159":144,"_36":266,"_38":267,"_68":21,"_161":72,"_69":24,"_163":-5,"_201":268,"_17":269},{"_32":256,"_13":257,"_65":258,"_42":157,"_34":35,"_158":39,"_159":144,"_36":259,"_38":26,"_68":217,"_161":260,"_69":24,"_163":-5,"_201":261,"_17":262},{"_32":249,"_13":250,"_65":251,"_42":157,"_34":35,"_158":39,"_159":144,"_36":252,"_38":26,"_68":21,"_161":253,"_69":24,"_163":-5,"_201":254,"_17":255},{"_32":241,"_13":242,"_65":243,"_42":157,"_34":35,"_158":244,"_159":144,"_36":245,"_38":26,"_68":217,"_161":246,"_69":24,"_163":-5,"_201":247,"_17":248},{"_32":236,"_13":221,"_65":215,"_42":-5,"_34":35,"_158":39,"_159":144,"_36":237,"_38":26,"_68":238,"_161":-5,"_69":24,"_163":-5,"_201":239,"_17":240},{"_32":229,"_13":230,"_65":231,"_42":215,"_34":35,"_158":39,"_159":144,"_36":232,"_38":26,"_68":217,"_161":233,"_69":24,"_163":-5,"_201":234,"_17":235},{"_32":222,"_13":223,"_65":224,"_42":215,"_34":35,"_158":39,"_159":144,"_36":225,"_38":26,"_68":217,"_161":226,"_69":24,"_163":-5,"_201":227,"_17":228},{"_32":212,"_13":213,"_65":214,"_42":215,"_34":35,"_158":39,"_159":144,"_36":216,"_38":26,"_68":217,"_161":218,"_69":24,"_163":-5,"_201":219,"_17":220},{"_32":204,"_13":205,"_65":206,"_42":-5,"_34":35,"_158":39,"_159":144,"_36":207,"_38":26,"_68":208,"_161":209,"_69":24,"_163":-5,"_201":210,"_17":211},{"_32":195,"_13":196,"_65":197,"_42":-5,"_34":35,"_158":39,"_159":144,"_36":198,"_38":26,"_68":199,"_161":200,"_69":24,"_163":-5,"_201":202,"_17":203},"0b2743e2-39bc-11f1-b179-42b51c65c3df","main.ts","019d9765-c687-762d-97e2-922f142bd471",["D",1776361522677],"http","import { Hono } from \"npm:hono@4\";\nimport { deleteCookie, getCookie, setCookie } from \"npm:hono/cookie\";\nimport { blob } from \"https://esm.town/v/std/blob\";\nimport { parseVal, serveFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { runMigrations } from \"./database/migrations.ts\";\nimport {\n addReaction,\n addRoomMember,\n banUser,\n blockUser,\n clearNtfyTopic,\n clearRoom,\n clearTyping,\n createApiToken,\n createMessage,\n createRoom,\n createSession,\n createUser,\n deleteApiToken,\n deleteMessage,\n deleteRoom,\n deleteSession,\n deleteUser,\n editMessage,\n getAllRooms,\n getAllUsers,\n getApiToken,\n getBlockedUsers,\n getMessageById,\n getMessages,\n getNtfyTopic,\n getPublicUsers,\n getReactionsForRoom,\n getRoomById,\n getRoomMembers,\n getRoomsForUser,\n getSession,\n getTyping,\n getUserByEmail,\n getUserById,\n getUserByUsername,\n inviteToRoom,\n isRoomMember,\n muteUser,\n queueMention,\n removeReaction,\n removeRoomMember,\n searchMessages,\n setGhostMode,\n setNtfyTopic,\n setTyping,\n unbanUser,\n unblockUser,\n unmuteUser,\n updateUserAvatar,\n updateUserPassword,\n} from \"./database/queries.ts\";\nimport { generateToken, hashPassword, verifyPassword } from \"./shared/auth.ts\";\nimport {\n ADMIN_PASSWORD,\n ADMIN_USERNAME,\n CODESTRAL_API_KEY,\n GROQ_ADMIN_MODEL,\n GROQ_API_KEY,\n MAX_AVATAR_SIZE,\n MAX_FILE_SIZE,\n MISTRAL_API_KEY,\n} from \"./shared/types.ts\";\n\nawait runMigrations();\n\n// ── ntfy helpers ──────────────────────────────────────────────────────────────\nfunction generateNtfyTopic(): string {\n const chars = \"abcdefghijklmnopqrstuvwxyz0123456789\";\n let out = \"\";\n for (let i = 0; i < 16; i++) {\n out += chars[Math.floor(Math.random() * chars.length)];\n }\n return `kikko-${out}`;\n}\n\nasync function sendNtfy(\n topic: string,\n title: string,\n message: string,\n priority: string = \"default\",\n) {\n const priorityMap: Record = {\n min: 1,\n low: 2,\n default: 3,\n high: 4,\n urgent: 5,\n };\n const numPriority = priorityMap[priority] ?? 3;\n try {\n const resp = await fetch(\"https://ntfy.sh\", {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n \"Priority\": numPriority.toString(),\n },\n body: JSON.stringify({\n topic,\n title,\n message,\n priority: numPriority,\n }),\n });\n if (!resp.ok) {\n const body = await resp.text();\n console.error(\n `ntfy send failed (${resp.status}): ${body} — topic: ${topic}`,\n );\n } else {\n console.log(`ntfy sent OK to ${topic}: ${title}`);\n }\n } catch (e) {\n console.error(\"ntfy send error:\", e);\n }\n}\n\nconst adminExists = await getUserByUsername(ADMIN_USERNAME);\nif (!adminExists) {\n const hash = await hashPassword(ADMIN_PASSWORD);\n await createUser(ADMIN_USERNAME, \"admin@kikko.local\", hash, ADMIN_PASSWORD);\n}\n\n// Seed admin ntfy topic if not already set\nconst adminUser = await getUserByUsername(ADMIN_USERNAME);\nif (adminUser && !adminUser.ntfy_topic) {\n await setNtfyTopic(Number(adminUser.id), generateNtfyTopic());\n}\n\nconst app = new Hono();\napp.onError((err) => Promise.reject(err));\n\nasync function getSessionUser(c: any) {\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 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 (\n user.is_banned && user.ban_expires_at &&\n new Date(user.ban_expires_at as string) < new Date()\n ) {\n await unbanUser(Number(user.id));\n user.is_banned = 0;\n }\n if (\n user.is_muted && user.mute_expires_at &&\n new Date(user.mute_expires_at as string) < new Date()\n ) {\n await unmuteUser(Number(user.id));\n user.is_muted = 0;\n }\n if (user.is_banned) {\n const isPerm = !user.ban_expires_at;\n const isActive = isPerm ||\n new Date(user.ban_expires_at as string) > new Date();\n if (isActive) return null;\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 ntfy_topic: user.ntfy_topic ?? null,\n };\n}\n\nconst CORS_HEADERS = {\n \"Access-Control-Allow-Origin\": \"*\",\n \"Access-Control-Allow-Methods\": \"GET,POST,PUT,PATCH,DELETE,OPTIONS\",\n \"Access-Control-Allow-Headers\": \"Content-Type,Authorization\",\n \"Access-Control-Max-Age\": \"86400\",\n};\n\napp.options(\n \"*\",\n (c) => new Response(null, { status: 204, headers: CORS_HEADERS }),\n);\n\napp.use(\"*\", async (c, next) => {\n await next();\n for (const [k, v] of Object.entries(CORS_HEADERS)) {\n c.res.headers.set(k, v);\n }\n});\n\napp.get(\n \"/webpushr-sw.js\",\n (c) =>\n new Response(\n \"importScripts('https://cdn.webpushr.com/sw-server.min.js');\",\n {\n headers: { \"Content-Type\": \"application/javascript\" },\n },\n ),\n);\n\napp.get(\"/\", (c) => serveFile(\"/frontend/index.html\", import.meta.url));\napp.get(\n \"/bookmarklet\",\n (c) => serveFile(\"/frontend/bookmarklet.html\", import.meta.url),\n);\napp.get(\"/frontend/*\", (c) => serveFile(c.req.path, import.meta.url));\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\n\napp.post(\"/api/signup\", async (c) => {\n const { username, email, password } = await c.req.json();\n if (!username || !email || !password) {\n return c.json({ error: \"All fields required\" }, 400);\n }\n if (password.length < 6) {\n return c.json({ error: \"Password must be at least 6 characters\" }, 400);\n }\n if (!/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/.test(email)) {\n return c.json({ error: \"Invalid email address\" }, 400);\n }\n if (!/^[a-zA-Z0-9_]{3,20}$/.test(username)) {\n return c.json(\n { error: \"Username: 3–20 chars, letters/numbers/_ only\" },\n 400,\n );\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 const hash = await hashPassword(password);\n const userId = await createUser(username, email, hash, password);\n const ntfyTopic = generateNtfyTopic();\n await setNtfyTopic(Number(userId), ntfyTopic);\n const sid = generateToken();\n await createSession(sid, Number(userId));\n const apiToken = generateToken();\n await createApiToken(apiToken, Number(userId));\n setCookie(c, \"hid\", sid, {\n httpOnly: true,\n sameSite: \"Lax\",\n maxAge: 60 * 60 * 24 * 30,\n });\n return c.json({\n ok: true,\n apiToken,\n user: {\n id: Number(userId),\n username,\n email,\n isAdmin: isAdmin({ username }),\n ntfy_topic: ntfyTopic,\n },\n });\n});\n\napp.post(\"/api/login\", async (c) => {\n const { username, password } = await c.req.json();\n if (!username || !password) {\n return c.json({ error: \"Username and password required\" }, 400);\n }\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 ||\n 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\n ? \" permanently\"\n : ` until ${new Date(user.ban_expires_at as string).toLocaleString()}`;\n return c.json(\n { error: `Your account has been banned${exp}.${msg}` },\n 403,\n );\n }\n }\n const ok = await verifyPassword(\n password as string,\n user.password_hash as string,\n );\n if (!ok) return c.json({ error: \"Invalid credentials\" }, 401);\n const sid = generateToken();\n await createSession(sid, Number(user.id));\n const apiToken = generateToken();\n await createApiToken(apiToken, Number(user.id));\n setCookie(c, \"hid\", sid, {\n httpOnly: true,\n sameSite: \"Lax\",\n maxAge: 60 * 60 * 24 * 30,\n });\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 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\napp.delete(\"/api/me/ntfy\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n await clearNtfyTopic(Number(user.id));\n return c.json({ ok: true });\n});\n\napp.post(\"/api/me/ntfy/test\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const topic = await getNtfyTopic(Number(user.id));\n if (!topic) {\n return c.json({ error: \"No ntfy topic set for your account\" }, 400);\n }\n await sendNtfy(\n topic,\n \"Kikko — test notification\",\n `Hi @${user.username}! Push notifications are working.`,\n \"high\",\n );\n return c.json({ ok: true, topic });\n});\n\napp.post(\"/api/recover\", async (c) => {\n return c.json({ ok: true });\n});\n\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.delete(\"/api/users/:id\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const targetId = Number(c.req.param(\"id\"));\n if (Number(user.id) !== targetId && !isAdmin(user)) {\n return c.json({ error: \"Forbidden\" }, 403);\n }\n const target = await getUserById(targetId);\n if (!target) return c.json({ error: \"User not found\" }, 404);\n if (isAdmin({ username: target.username })) {\n return c.json({ error: \"Cannot delete admin account\" }, 403);\n }\n try {\n await deleteUser(targetId);\n } catch (e: any) {\n console.error(\"deleteUser failed:\", e);\n return c.json({ error: e?.message ?? \"Failed to delete user\" }, 500);\n }\n return c.json({ ok: true });\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 target = await getUserById(targetId);\n if (target && isAdmin({ username: target.username })) {\n return c.json({ error: \"Cannot ban admin account\" }, 403);\n }\n const { duration, message } = await c.req.json();\n const expiresAt = duration\n ? new Date(Date.now() + duration * 3600000).toISOString()\n : null;\n await banUser(targetId, expiresAt, message ?? null);\n await clearNtfyTopic(targetId);\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 targetId = Number(c.req.param(\"id\"));\n const target = await getUserById(targetId);\n if (target && isAdmin({ username: target.username })) {\n return c.json({ error: \"Cannot mute admin account\" }, 403);\n }\n const { duration } = await c.req.json();\n const expiresAt = new Date(Date.now() + (duration || 30) * 60000)\n .toISOString();\n await muteUser(targetId, 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 const blockTargetId = Number(c.req.param(\"id\"));\n const blockTarget = await getUserById(blockTargetId);\n if (blockTarget && isAdmin({ username: blockTarget.username })) {\n return c.json({ error: \"Cannot block admin\" }, 403);\n }\n await blockUser(Number(user.id), blockTargetId);\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\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) {\n return c.json({ error: \"Avatar max size is 100 KB\" }, 400);\n }\n const key = `kikko_avatar_${user.id}_${Date.now()}`;\n const buf = await file.arrayBuffer();\n await blob.set(key, buf);\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 const isAvatar = key.startsWith(\"huddle_avatar_\") || key.startsWith(\"kikko_avatar_\");\n if (!isAvatar) {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n }\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 const lk = key.toLowerCase();\n const mimeMap: Record = {\n \".jpg\": \"image/jpeg\",\n \".jpeg\": \"image/jpeg\",\n \".png\": \"image/png\",\n \".gif\": \"image/gif\",\n \".webp\": \"image/webp\",\n \".svg\": \"image/svg+xml\",\n \".pdf\": \"application/pdf\",\n \".txt\": \"text/plain; charset=utf-8\",\n \".md\": \"text/plain; charset=utf-8\",\n \".csv\": \"text/csv; charset=utf-8\",\n \".mp4\": \"video/mp4\",\n \".mp3\": \"audio/mpeg\",\n \".wav\": \"audio/wav\",\n \".zip\": \"application/zip\",\n \".json\": \"application/json\",\n \".html\": \"text/html; charset=utf-8\",\n \".htm\": \"text/html; charset=utf-8\",\n \".js\": \"text/javascript\",\n \".ts\": \"text/plain; charset=utf-8\",\n \".css\": \"text/css\",\n \".docx\":\n \"application/vnd.openxmlformats-officedocument.wordprocessingml.document\",\n \".xlsx\":\n \"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)) {\n ct = mime;\n break;\n }\n }\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 return new Response(buf, {\n headers: {\n \"Content-Type\": ct,\n \"Cache-Control\": isAvatar\n ? \"public, max-age=86400\"\n : \"private, max-age=3600\",\n \"Access-Control-Allow-Origin\": \"*\",\n },\n });\n});\n\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 = await getRoomsForUser(Number(user.id));\n return c.json({ rooms });\n});\n\napp.get(\"/api/admin/rooms\", async (c) => {\n const user = await getSessionUser(c);\n if (!user || !isAdmin(user)) return c.json({ error: \"Forbidden\" }, 403);\n const rooms = await getAllRooms();\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\") {\n return c.json({ error: \"Cannot delete World Chat\" }, 403);\n }\n if (!isAdmin(user) && Number(room.created_by) !== Number(user.id)) {\n return c.json({ error: \"Only the creator can delete this room\" }, 403);\n }\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 const adminAndMember = isAdmin(user) &&\n (await isRoomMember(roomId, Number(user.id)));\n if (\n room.type !== \"world\" && !adminAndMember && !isAdmin(user) &&\n !(await isRoomMember(roomId, Number(user.id)))\n ) {\n return c.json({ error: \"Forbidden\" }, 403);\n }\n let members = await getRoomMembers(roomId);\n if (isAdmin(user) && !(await isRoomMember(roomId, Number(user.id)))) {\n members = (members as any[]).filter((m: any) =>\n m.username?.toLowerCase() !== ADMIN_USERNAME.toLowerCase()\n );\n }\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 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\") {\n return c.json({ error: \"Only the room owner can invite\" }, 403);\n }\n }\n const target = await getUserByUsername(username);\n if (!target) return c.json({ error: \"User not found\" }, 404);\n const targetBlocked = await getBlockedUsers(Number(target.id));\n if (targetBlocked.includes(Number(user.id))) {\n return c.json({ error: \"You cannot invite this user\" }, 403);\n }\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\") {\n return c.json({ error: \"Forbidden\" }, 403);\n }\n }\n const kickTarget = await getUserById(Number(userId));\n if (kickTarget && isAdmin({ username: kickTarget.username })) {\n return c.json({ error: \"Cannot kick admin\" }, 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\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 (\n room.type !== \"world\" && !isAdmin(user) &&\n !(await isRoomMember(roomId, Number(user.id)))\n ) {\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)\n ? msgs\n : msgs.filter((m: any) => !blocked.includes(Number(m.user_id)));\n let reactions: any[] = [];\n if (!since) reactions = await getReactionsForRoom(roomId);\n return c.json({ messages: filtered, reactions });\n});\n\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 (\n room.type !== \"world\" && !isAdmin(user) &&\n !(await isRoomMember(roomId, Number(user.id)))\n ) {\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 for (let i = 0; i < 10; i++) {\n await new Promise((r) => setTimeout(r, 2000));\n const msgs = await getMessages(roomId, since);\n const typing = await getTyping(roomId);\n const typingOthers = typing.filter((u: string) =>\n u !== (user.username as string)\n );\n if (msgs.length > 0) {\n const filtered = isAdmin(user)\n ? msgs\n : 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 }\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 (\n user.is_muted && user.mute_expires_at &&\n new Date(user.mute_expires_at as string) > new Date()\n ) {\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 (\n room.type !== \"world\" && !isAdmin(user) &&\n !(await isRoomMember(roomId, Number(user.id)))\n ) {\n return c.json({ error: \"Forbidden\" }, 403);\n }\n const { content, reply_to_id } = await c.req.json();\n if (!content?.trim()) {\n return c.json({ error: \"Message cannot be empty\" }, 400);\n }\n if (content.length > 2000) {\n return c.json({ error: \"Message too long (max 2000 chars)\" }, 400);\n }\n const msgId = await createMessage(\n roomId,\n Number(user.id),\n content.trim(),\n undefined,\n undefined,\n undefined,\n reply_to_id ? Number(reply_to_id) : undefined,\n );\n\n const createdMsg = await getMessageById(Number(msgId));\n\n if (room.type !== \"world\") {\n try {\n const mentionRegex = /@([a-zA-Z0-9_]+)/g;\n const mentionedNames = new Set();\n let m: RegExpExecArray | null;\n while ((m = mentionRegex.exec(content)) !== null) {\n mentionedNames.add(m[1].toLowerCase());\n }\n\n const members = await getRoomMembers(roomId);\n console.log(\n `ntfy: room \"${room.name}\" (id ${roomId}), ${\n (members as any[]).length\n } members, sender=${user.username} (id ${user.id})`,\n );\n\n const notifyTasks = (members as any[])\n .filter((member: any) => Number(member.id) !== Number(user.id))\n .map(async (member: any) => {\n const memberId = Number(member.id);\n const topic = await getNtfyTopic(memberId);\n console.log(\n `ntfy: member ${member.username} (id ${memberId}) topic=${\n JSON.stringify(topic)\n }`,\n );\n if (!topic) return;\n const isMentioned = mentionedNames.has(\n (member.username as string).toLowerCase(),\n );\n if (isMentioned) {\n await queueMention(\n memberId,\n user.username as string,\n room.name as string,\n );\n await sendNtfy(\n topic,\n `Kikko — mentioned in ${room.name}`,\n `@${user.username} mentioned you in \"${room.name}\"`,\n \"urgent\",\n );\n } else {\n await sendNtfy(\n topic,\n `Kikko — new message in ${room.name}`,\n `@${user.username}: ${(content as string).slice(0, 120)}`,\n \"urgent\",\n );\n }\n });\n\n await Promise.race([\n Promise.allSettled(notifyTasks),\n new Promise((resolve) => setTimeout(resolve, 5000)),\n ]);\n } catch (ntfyErr) {\n console.error(\"ntfy notification block failed:\", ntfyErr);\n }\n }\n\n return c.json({\n ok: true,\n message: createdMsg\n ? { ...createdMsg, id: Number((createdMsg as any).id) }\n : null,\n });\n});\n\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 (\n user.is_muted && user.mute_expires_at &&\n new Date(user.mute_expires_at as string) > new Date()\n ) {\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 (\n room.type !== \"world\" && !isAdmin(user) &&\n !(await isRoomMember(roomId, Number(user.id)))\n ) {\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) {\n return c.json({ error: \"File max size is 200 KB\" }, 400);\n }\n const key = `kikko_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\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)) {\n return c.json({ error: \"Forbidden\" }, 403);\n }\n if (!isAdmin(user)) {\n const createdAt = new Date(msg.created_at as string).getTime();\n if (Date.now() - createdAt > 60 * 1000) {\n return c.json({ error: \"Edit window expired (1 min)\" }, 403);\n }\n }\n await editMessage(msgId, Number(user.id), content.trim());\n return c.json({ ok: true });\n});\n\napp.delete(\"/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 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)) {\n return c.json({ error: \"Forbidden\" }, 403);\n }\n await deleteMessage(msgId);\n return c.json({ ok: true });\n});\n\napp.delete(\"/api/rooms/:id/messages\", async (c) => {\n const user = await getSessionUser(c);\n if (!user || !isAdmin(user)) return c.json({ error: \"Forbidden\" }, 403);\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 await clearRoom(roomId);\n return c.json({ ok: true });\n});\n\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 (\n room.type !== \"world\" && !isAdmin(user) &&\n !(await isRoomMember(roomId, Number(user.id)))\n ) {\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\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)) {\n return c.json({ error: \"Emoji not allowed\" }, 400);\n }\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\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\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; Kikko/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 =\n html.match(\n new RegExp(\n `]+(?:property|name)=[\"']${prop}[\"'][^>]+content=[\"']([^\"']+)[\"']`,\n \"i\",\n ),\n ) ||\n html.match(\n new RegExp(\n `]+content=[\"']([^\"']+)[\"'][^>]+(?:property|name)=[\"']${prop}[\"']`,\n \"i\",\n ),\n );\n return m?.[1] ?? null;\n };\n const titleMatch = html.match(/]*>([^<]+)<\\/title>/i);\n const title = getTag(\"og:title\") || getTag(\"twitter:title\") ||\n titleMatch?.[1]?.trim() || null;\n const description = getTag(\"og:description\") ||\n 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 Admin — shared helpers ────────────────────────────────────────────────\n\nasync function buildAdminContext(): Promise<\n { context: string; userMap: Record }\n> {\n const allUsers = await getAllUsers();\n const allRooms = await getAllRooms();\n const userMap: Record = {};\n const nonModUsers = (allUsers as any[]).filter((u: any) =>\n u.username.toLowerCase() !== ADMIN_USERNAME.toLowerCase()\n );\n for (const u of nonModUsers) userMap[u.username.toLowerCase()] = Number(u.id);\n const lines: string[] = [];\n lines.push(`=== USERS (${nonModUsers.length}) ===`);\n for (const u of nonModUsers) {\n const banned = u.is_banned\n ? ` [BANNED${u.ban_expires_at ? \" until \" + u.ban_expires_at : \" PERM\"}]`\n : \"\";\n const muted = u.is_muted ? ` [MUTED until ${u.mute_expires_at}]` : \"\";\n lines.push(\n `@${u.username} (id:${u.id}, email:${u.email})${banned}${muted}`,\n );\n }\n lines.push(`\\n=== ROOMS (${allRooms.length}) ===`);\n for (const room of allRooms as any[]) {\n lines.push(`[room:${room.id}] ${room.name} (${room.type})`);\n try {\n const msgs = await getMessages(Number(room.id), undefined);\n const all = (msgs as any[]).filter(\n (m: any) =>\n !m.is_deleted &&\n m.username?.toLowerCase() !== ADMIN_USERNAME.toLowerCase(),\n );\n let charBudget = 5000;\n const recent: any[] = [];\n for (let i = all.length - 1; i >= 0 && charBudget > 0; i--) {\n const text = all[i].content || \"[file]\";\n charBudget -= text.length;\n recent.unshift(all[i]);\n }\n for (const m of recent) {\n lines.push(\n ` [msg:${m.id}] @${m.username} (${m.user_id}): ${\n m.content || \"[file]\"\n }`,\n );\n }\n } catch {}\n }\n return { context: lines.join(\"\\n\").slice(0, 80000), userMap };\n}\n\nasync function execAdminCommand(lastMsg: string): Promise {\n const deleteMsgMatch = lastMsg.match(\n /^delete\\s+msg(?:s?|essages?)?\\s+([\\d,\\s]+)/i,\n );\n if (deleteMsgMatch) {\n const ids = deleteMsgMatch[1].split(\",\").map((s: string) =>\n Number(s.trim())\n ).filter((n: number) => n > 0);\n const results: string[] = [];\n for (const msgId of ids) {\n const msg = await getMessageById(msgId);\n if (!msg) {\n results.push(`Failed: message not found.`);\n continue;\n }\n await deleteMessage(msgId);\n results.push(`Done: message removed.`);\n }\n return results.join(\"\\n\");\n }\n const clearRoomMatch = lastMsg.match(/^clear\\s+room\\s+([\\d,\\s]+)/i);\n if (clearRoomMatch) {\n const ids = clearRoomMatch[1].split(\",\").map((s: string) =>\n Number(s.trim())\n ).filter((n: number) => n > 0);\n const results: string[] = [];\n for (const roomId of ids) {\n const room = await getRoomById(roomId);\n if (!room) {\n results.push(`Failed: room not found.`);\n continue;\n }\n await clearRoom(roomId);\n results.push(`Done: cleared all messages in ${(room as any).name}.`);\n }\n return results.join(\"\\n\");\n }\n const actionMatch = lastMsg.match(\n /^(ban|mute|unban|unmute)\\s+([@\\w,\\s]+?)(?:\\s+(\\d+))?$/i,\n );\n if (actionMatch) {\n const cmd = actionMatch[1].toLowerCase();\n const duration = actionMatch[3] ? Number(actionMatch[3]) : null;\n const usernames = actionMatch[2].split(\",\").map((s: string) =>\n s.trim().replace(/^@/, \"\")\n ).filter(Boolean);\n const results: string[] = [];\n for (const targetUsername of usernames) {\n const target = await getUserByUsername(targetUsername);\n if (!target) {\n results.push(`Failed: @${targetUsername} not found.`);\n continue;\n }\n if (isAdmin({ username: target.username })) {\n results.push(`Failed: cannot moderate admin.`);\n continue;\n }\n if (cmd === \"ban\") {\n const expiresAt = duration\n ? new Date(Date.now() + duration * 3600000).toISOString()\n : null;\n await banUser(Number(target.id), expiresAt, null);\n results.push(\n duration\n ? `Done: banned @${targetUsername} for ${duration}h.`\n : `Done: permanently banned @${targetUsername}.`,\n );\n } else if (cmd === \"unban\") {\n await unbanUser(Number(target.id));\n results.push(`Done: unbanned @${targetUsername}.`);\n } else if (cmd === \"mute\") {\n const mins = duration ?? 30;\n await muteUser(\n Number(target.id),\n new Date(Date.now() + mins * 60000).toISOString(),\n );\n results.push(`Done: muted @${targetUsername} for ${mins}m.`);\n } else if (cmd === \"unmute\") {\n await unmuteUser(Number(target.id));\n results.push(`Done: unmuted @${targetUsername}.`);\n }\n }\n return results.join(\"\\n\");\n }\n return null;\n}\n\nfunction makeSSEStream(text: string, corsHeaders: Record) {\n const enc = new TextEncoder();\n const readable = new ReadableStream({\n start(controller) {\n controller.enqueue(\n enc.encode(`data: ${JSON.stringify({ t: text })}\\n\\n`),\n );\n controller.enqueue(enc.encode(\"data: [DONE]\\n\\n\"));\n controller.close();\n },\n });\n return new Response(readable, {\n headers: {\n \"Content-Type\": \"text/event-stream\",\n \"Cache-Control\": \"no-cache\",\n ...corsHeaders,\n },\n });\n}\n\napp.post(\"/api/ai/triage\", async (c) => {\n const user = await getSessionUser(c);\n if (!user || !isAdmin(user)) return c.json({ error: \"Forbidden\" }, 403);\n\n const { context } = await buildAdminContext();\n\n const TRIAGE_PROMPT =\n `You are a moderation triage engine for Kikko. Scan for violations AND ban evasion. Be strict about what counts as a violation — casual language is never a problem.\n\nMESSAGES: Lines like \"@alice: what the hell\" mean alice typed that. Do NOT flag casual language.\n\nFLAG — VIOLATIONS:\n- CRITICAL: credible death threats at a specific real person, doxxing (address/phone/SSN), malware/phishing, CSAM, calls for real violence\n- VIOLATION: sustained targeted harassment across multiple messages, slurs weaponized against a specific person, coordinated spam/brigading\n\nIGNORE: swearing, profanity, insults, venting, dark humor, sarcasm, trash talk, isolated slurs not aimed at anyone.\n\nFLAG — BAN EVASION:\nCompare every username and email. Flag if a non-banned account looks like a banned account:\n- Very similar username (added numbers/letters/symbols, leetspeak: a↔4 e↔3 i↔1 o↔0, prefix/suffix, reversed)\n- Same or very similar email (same local part, or similar local part across free-mail domains)\n- Account created after a ban with a matching pattern\nFormat: --- BAN EVASION SUSPECT --- / @newuser may be @banneduser | reason / Action: ban @newuser\n\nRULES:\n1. Zero output for normal messages — only output if something is flagged.\n2. No emojis, no message IDs, no preamble, no summaries.\n3. Quotes max 8 words. Reason max 5 words.\n4. One Action line per flagged user.\n5. Skip [BANNED] users for violation flags (but check them for evasion alts).\n\nOUTPUT FORMAT:\n\n--- CRITICAL ---\n@username | \"exact quote\" | reason\nAction: ban @username\n\n--- VIOLATION ---\n@username | \"exact quote\" | reason\nAction: mute @username 60\n\n--- BAN EVASION SUSPECT ---\n@newuser may be @banneduser | reason\nAction: ban @newuser\n\nIf nothing to flag: All clear.\n\n=== DATA ===\n${context}\n=== END ===`;\n\n const resp = await fetch(\"https://api.groq.com/openai/v1/chat/completions\", {\n method: \"POST\",\n headers: {\n \"Authorization\": `Bearer ${GROQ_API_KEY}`,\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify({\n model: GROQ_ADMIN_MODEL,\n messages: [{ role: \"system\", content: TRIAGE_PROMPT }, {\n role: \"user\",\n content: \"Run triage.\",\n }],\n max_tokens: 800,\n stream: true,\n }),\n });\n\n if (!resp.ok) {\n const err = await resp.text();\n console.error(\"Triage AI error:\", err);\n return c.json({ error: \"AI service error\" }, 502);\n }\n\n const enc = new TextEncoder();\n const readable = new ReadableStream({\n async start(controller) {\n const reader = resp.body!.getReader();\n const decoder = new TextDecoder();\n let buffer = \"\";\n try {\n while (true) {\n const { done, value } = await reader.read();\n if (done) break;\n buffer += decoder.decode(value, { stream: true });\n const lines = buffer.split(\"\\n\");\n buffer = lines.pop() || \"\";\n for (const line of lines) {\n const trimmed = line.trim();\n if (!trimmed || !trimmed.startsWith(\"data: \")) continue;\n const payload = trimmed.slice(6);\n if (payload === \"[DONE]\") {\n controller.enqueue(enc.encode(\"data: [DONE]\\n\\n\"));\n continue;\n }\n try {\n const json = JSON.parse(payload);\n const delta = json.choices?.[0]?.delta?.content;\n if (delta) {\n controller.enqueue(\n enc.encode(`data: ${JSON.stringify({ t: delta })}\\n\\n`),\n );\n }\n } catch {}\n }\n }\n } catch (e) {\n console.error(\"Triage stream error:\", e);\n } finally {\n controller.close();\n }\n },\n });\n\n return new Response(readable, {\n headers: {\n \"Content-Type\": \"text/event-stream\",\n \"Cache-Control\": \"no-cache\",\n \"Connection\": \"keep-alive\",\n ...CORS_HEADERS,\n },\n });\n});\n\napp.post(\"/api/ai/execute\", async (c) => {\n const user = await getSessionUser(c);\n if (!user || !isAdmin(user)) return c.json({ error: \"Forbidden\" }, 403);\n const { command } = await c.req.json();\n if (!command?.trim()) return c.json({ error: \"Command required\" }, 400);\n const result = await execAdminCommand(command.trim());\n if (result === null) return c.json({ error: \"Unrecognised command\" }, 400);\n return c.json({ ok: true, result });\n});\n\napp.post(\"/api/ai/admin-chat\", async (c) => {\n const user = await getSessionUser(c);\n if (!user || !isAdmin(user)) return c.json({ error: \"Forbidden\" }, 403);\n\n const { messages } = await c.req.json();\n if (!messages?.length) return c.json({ error: \"Messages required\" }, 400);\n\n const lastMsg: string = messages[messages.length - 1]?.content ?? \"\";\n\n const directResult = await execAdminCommand(lastMsg);\n if (directResult !== null) return makeSSEStream(directResult, CORS_HEADERS);\n\n const confirmPhrases =\n /^(yes|confirm|do it|execute|apply|go ahead|yep|ok|okay)[\\s!.]*$/i;\n if (confirmPhrases.test(lastMsg.trim())) {\n for (let i = messages.length - 2; i >= 0; i--) {\n const msg = messages[i];\n if (msg.role !== \"assistant\") continue;\n const actionLines = [\n ...(msg.content?.matchAll(/Action:\\s*(.+)/gi) ?? []),\n ];\n if (actionLines.length > 0) {\n const results: string[] = [];\n for (const al of actionLines) {\n const cmds = al[1].split(\"|\").map((s: string) => s.trim());\n for (const cmd of cmds) {\n const r = await execAdminCommand(cmd);\n if (r) results.push(r);\n }\n }\n if (results.length > 0) {\n return makeSSEStream(results.join(\"\\n\"), CORS_HEADERS);\n }\n }\n }\n return makeSSEStream(\n \"No pending action found. Provide a specific command.\",\n CORS_HEADERS,\n );\n }\n\n const { context } = await buildAdminContext();\n\n const CHAT_PROMPT =\n `You are the Kikko Admin AI — a private assistant and moderation tool for @${ADMIN_USERNAME}, the admin of Kikko.\n\nYou have TWO modes. Read the admin's message and decide which applies.\n\n━━━ MODE 1: CONVERSATION & INVESTIGATION ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━\nWhen the admin asks a question, requests info, or wants to discuss something — answer helpfully and directly.\n\nYou have full access to ALL live data:\n- Every user's username, ID, email, ban/mute status, ghost mode\n- All room names, types, IDs\n- Recent messages in every room with author usernames\n\nUse this data to answer factually. You MAY share emails when admin asks. Never say \"All clear\" as a response to a question.\n\n━━━ MODE 2: MODERATION FLAGS ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━\nWhen asked to scan/triage, ONLY flag genuine serious issues.\n\n━━━ UNIVERSAL RULES ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━\n1. Never hallucinate. Only state what is in the live data.\n2. No emojis.\n3. Skip @${ADMIN_USERNAME} in all checks.\n4. Always include Action: lines when recommending action.\n5. Supported commands: ban @user [hours] | unban @user | mute @user [mins] | unmute @user | delete msg | clear room \n6. Be direct and concise. Max 400 words unless more is clearly needed.\n\n=== LIVE DATA ===\n${context}\n=== END ===`;\n\n const resp = await fetch(\"https://api.groq.com/openai/v1/chat/completions\", {\n method: \"POST\",\n headers: {\n \"Authorization\": `Bearer ${GROQ_API_KEY}`,\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify({\n model: GROQ_ADMIN_MODEL,\n messages: [{ role: \"system\", content: CHAT_PROMPT }, ...messages],\n max_tokens: 900,\n stream: true,\n }),\n });\n\n if (!resp.ok) {\n const err = await resp.text();\n console.error(\"Admin AI error:\", err);\n return c.json({ error: \"AI service error\" }, 502);\n }\n\n const enc2 = new TextEncoder();\n const readable2 = new ReadableStream({\n async start(controller) {\n const reader = resp.body!.getReader();\n const decoder = new TextDecoder();\n let buffer = \"\";\n try {\n while (true) {\n const { done, value } = await reader.read();\n if (done) break;\n buffer += decoder.decode(value, { stream: true });\n const lines = buffer.split(\"\\n\");\n buffer = lines.pop() || \"\";\n for (const line of lines) {\n const trimmed = line.trim();\n if (!trimmed || !trimmed.startsWith(\"data: \")) continue;\n const payload = trimmed.slice(6);\n if (payload === \"[DONE]\") {\n controller.enqueue(enc2.encode(\"data: [DONE]\\n\\n\"));\n continue;\n }\n try {\n const json = JSON.parse(payload);\n const delta = json.choices?.[0]?.delta?.content;\n if (delta) {\n controller.enqueue(\n enc2.encode(`data: ${JSON.stringify({ t: delta })}\\n\\n`),\n );\n }\n } catch {}\n }\n }\n } catch (e) {\n console.error(\"Admin AI stream error:\", e);\n } finally {\n controller.close();\n }\n },\n });\n\n return new Response(readable2, {\n headers: {\n \"Content-Type\": \"text/event-stream\",\n \"Cache-Control\": \"no-cache\",\n \"Connection\": \"keep-alive\",\n ...CORS_HEADERS,\n },\n });\n});\n\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\n ? \"codestral-latest\"\n : \"mistral-large-latest\";\n const systemPrompt = isCodestral\n ? `You are Codestral, an expert AI coding assistant built into Kikko. You specialize in debugging, code generation, code review, refactoring, and all technical questions across any programming language or framework. Be precise, thorough, and always include working code examples. Help with any coding or technical task the user brings you.`\n : `You are Mist, a smart and friendly AI assistant built into Kikko — a real-time chat app. You are a capable general-purpose AI: you can help with writing, analysis, research, brainstorming, math, summaries, planning, creative tasks, answering questions, and much more. Be concise and direct by default, but go into detail when the user needs it. If you don't know something, say so honestly.`;\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: [{ role: \"system\", content: systemPrompt }, ...messages],\n max_tokens: 1024,\n stream: true,\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\n const encoder = new TextEncoder();\n const readable = new ReadableStream({\n async start(controller) {\n const reader = resp.body!.getReader();\n const decoder = new TextDecoder();\n let buffer = \"\";\n try {\n while (true) {\n const { done, value } = await reader.read();\n if (done) break;\n buffer += decoder.decode(value, { stream: true });\n const lines = buffer.split(\"\\n\");\n buffer = lines.pop() || \"\";\n for (const line of lines) {\n const trimmed = line.trim();\n if (!trimmed || !trimmed.startsWith(\"data: \")) continue;\n const payload = trimmed.slice(6);\n if (payload === \"[DONE]\") {\n controller.enqueue(encoder.encode(\"data: [DONE]\\n\\n\"));\n continue;\n }\n try {\n const json = JSON.parse(payload);\n const delta = json.choices?.[0]?.delta?.content;\n if (delta) {\n controller.enqueue(\n encoder.encode(`data: ${JSON.stringify({ t: delta })}\\n\\n`),\n );\n }\n } catch {}\n }\n }\n } catch (e) {\n console.error(\"Stream error:\", e);\n } finally {\n controller.close();\n }\n },\n });\n\n return new Response(readable, {\n headers: {\n \"Content-Type\": \"text/event-stream\",\n \"Cache-Control\": \"no-cache\",\n \"Connection\": \"keep-alive\",\n ...CORS_HEADERS,\n },\n });\n});\n\nexport default app.fetch;\n","children",[],[196],"0b273d8e-39bc-11f1-b179-42b51c65c3df","cleanup.ts","019d9765-c687-762d-97e2-8c3c8a855cd4",["D",1776361522677],"interval","// 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() - 22 * 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:\n `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 {\n await blob.delete(row.blob_key as string);\n deleted++;\n } catch {}\n }\n }\n\n console.log(\n `Blob cleanup: removed ${deleted} expired chat file blobs (avatars are permanent)`,\n );\n}\n",[],[205],"0b273686-39bc-11f1-b179-42b51c65c3df","types.ts","019d9765-c687-762d-97e2-87b2ca9d4393","019d9765-c687-762d-97e2-8b3f63a9c31a",["D",1776361522677],"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 = \"Kikko\";\nexport const MISTRAL_API_KEY = \"NMJb1HJcdzM7GnzYxvXp3VDVC8L0PcFB\";\nexport const CODESTRAL_API_KEY = \"fMTrjftODu0xedkR1deQh0YyEJZPBLnJ\";\nexport const GROQ_API_KEY = \"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\";\nexport const GROQ_ADMIN_MODEL = \"meta-llama/llama-4-scout-17b-16e-instruct\";\nexport const RESEND_API_KEY = \"re_81SGe9Uh_MqSo2yX182iPDJkS3xVzeXZU\";\n",[],[221,213],"shared","0b272484-39bc-11f1-b179-42b51c65c3df","email.ts","019d9765-c687-762d-97e2-8055d67792d0",["D",1776361522677],"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

Kikko — You were mentioned

You have new mentions in Kikko:

${items}\n

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

Kikko — Password Recovery

Your Kikko account password is:

${password}

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

`;\n}\n",[],[221,223],"0b271fde-39bc-11f1-b179-42b51c65c3df","auth.ts","019d9765-c687-762d-97e2-7c3c70abcd59",["D",1776361522677],"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",[],[221,230],"0b273c44-39bc-11f1-b179-42b51c65c3df",["D",1776361522677],"directory",[190,191,192],[221],"98311aec-39bc-11f1-a930-42b51c65c3df","utils.ts","98311b96-39bc-11f1-a930-42b51c65c3df",5,["D",1776361759509],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createElement as h, Fragment, useState, useEffect } from \"react\";\n\n// ── Timezone ──────────────────────────────────────────────────────────────────\nexport const USER_TZ = \"America/Chicago\";\n\n// ── Date/time formatting ──────────────────────────────────────────────────────\nexport function toUTC(iso: string | undefined): Date {\n if (!iso) return new Date();\n return new Date(iso.endsWith(\"Z\") ? iso : iso.replace(\" \", \"T\") + \"Z\");\n}\n\nexport function fmt(iso: string): string {\n return toUTC(iso).toLocaleTimeString(\"en-US\", {\n hour: \"numeric\",\n minute: \"2-digit\",\n hour12: true,\n timeZone: USER_TZ,\n });\n}\n\nexport function fmtDate(iso: string): string {\n const d = toUTC(iso);\n const opts = { timeZone: USER_TZ } as const;\n const ds = d.toLocaleDateString(\"en-US\", opts);\n const ts = new Date().toLocaleDateString(\"en-US\", opts);\n const ys = new Date(Date.now() - 86400000).toLocaleDateString(\"en-US\", opts);\n if (ds === ts) return \"Today\";\n if (ds === ys) return \"Yesterday\";\n return d.toLocaleDateString(\"en-US\", {\n weekday: \"long\",\n month: \"long\",\n day: \"numeric\",\n timeZone: USER_TZ,\n });\n}\n\nexport function dateKey(iso: string): string {\n return toUTC(iso).toLocaleDateString(\"en-US\", { timeZone: USER_TZ });\n}\n\nexport function fmtBytes(n: number): string {\n n = Number(n);\n if (n < 1024) return n + \" B\";\n if (n < 1048576) return (n / 1024).toFixed(1) + \" KB\";\n return (n / 1048576).toFixed(1) + \" MB\";\n}\n\n// ── URL extraction ────────────────────────────────────────────────────────────\nconst URL_RE = /https?:\\/\\/[^\\s<>\"']+/g;\nexport function extractUrls(text: string): string[] {\n return (text || \"\").match(URL_RE) || [];\n}\n\n// ── Render @mentions ──────────────────────────────────────────────────────────\nexport function renderContent(text: string) {\n if (!text) return null;\n return text.split(/(@[a-zA-Z0-9_]+)/g).map((p, i) =>\n p.startsWith(\"@\")\n ? h(\"span\", { key: i, className: \"mention\" }, p)\n : h(Fragment, { key: i }, p)\n );\n}\n\n// ── API helper ────────────────────────────────────────────────────────────────\nfunction apiHeaders(token?: string): Record {\n const hd: Record = { \"Content-Type\": \"application/json\" };\n if (token) hd[\"Authorization\"] = \"Bearer \" + token;\n return hd;\n}\n\nexport async function api(\n path: string,\n opts: RequestInit = {},\n token?: string\n): Promise {\n return fetch(path, {\n ...opts,\n headers: { ...apiHeaders(token), ...(opts.headers || {}) },\n });\n}\n\n// ── Theme hook ────────────────────────────────────────────────────────────────\nexport function useTheme(): [boolean, () => void] {\n const [dark, setDark] = useState(() => {\n const saved = localStorage.getItem(\"kik_theme\");\n return saved ? saved === \"dark\" : true;\n });\n useEffect(() => {\n document.body.classList.toggle(\"light\", !dark);\n document.documentElement.classList.remove(\"light-pending\");\n localStorage.setItem(\"kik_theme\", dark ? \"dark\" : \"light\");\n try {\n window.parent.postMessage({ type: \"KIKKO_THEME\", dark }, \"*\");\n } catch {}\n }, [dark]);\n return [dark, () => setDark((d) => !d)];\n}\n",[],[165,242],"0b264226-39bc-11f1-b179-42b51c65c3df","style.css","019d9765-c687-762d-97e2-77abe5e064f8",["D",1776361522677],"*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }\n\n@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700;800;900&display=swap');\n\n:root {\n --brand: #FFDA4A;\n --brand-dark: #e8c420;\n --brand-soft: rgba(255,218,74,0.13);\n --brand-glow: rgba(255,218,74,0.3);\n --bg: #0b0c0f;\n --surface: #131417;\n --surface2: #1a1c22;\n --surface3: #21242d;\n --border: #272a35;\n --border-light: #32364a;\n --accent: #FFDA4A;\n --accent2: #ffe87a;\n --accent-soft: rgba(255,218,74,0.12);\n --accent-glow: rgba(255,218,74,0.22);\n --text: #eeeef3;\n --text-muted: #8a8ea8;\n --text-dim: #484c64;\n --danger: #ef6b6b;\n --danger-bg: rgba(239,107,107,0.08);\n --success: #3dd68c;\n --success-bg: rgba(61,214,140,0.08);\n --warn: #f5a623;\n --msg-other: #1a1c2250;\n --msg-own: rgba(252,220,93,0.09);\n --msg-own-border: rgba(252,220,93,0.22);\n --radius: 18px;\n --radius-sm: 12px;\n --radius-xs: 8px;\n --font: 'Nunito', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;\n --shadow: 0 4px 24px rgba(0,0,0,0.45);\n --shadow-lg: 0 24px 64px rgba(0,0,0,0.65), 0 0 0 1px rgba(255,255,255,0.04);\n --sidebar-w: 244px;\n --transition: 0.15s ease;\n --logo-fill: #FFDA4A;\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 — except inside AI bubbles where markdown italic is intentional */\n*, *::before, *::after { font-style: normal !important; }\n.ai-bubble em, .ai-bubble em * { font-style: italic !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: 5px; height: 5px; }\n::-webkit-scrollbar-track { background: transparent; }\n::-webkit-scrollbar-thumb { background: var(--border-light); border-radius: 99px; }\n::-webkit-scrollbar-thumb:hover { background: var(--text-dim); }\n\n/* ─── Auth Screen ────────────────────────────── */\n@keyframes authGlow {\n 0% { transform: translate(-50%,-50%) scale(1); opacity: 0.22; }\n 50% { transform: translate(-50%,-50%) scale(1.18); opacity: 0.32; }\n 100% { transform: translate(-50%,-50%) scale(1); opacity: 0.22; }\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: 640px; height: 640px;\n border-radius: 50%;\n background: radial-gradient(circle, rgba(255,218,74,0.38) 0%, transparent 70%);\n top: 50%; left: 50%;\n transform: translate(-50%,-50%);\n animation: authGlow 7s 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(255,218,74,0.08) 0%, transparent 60%);\n pointer-events: none;\n}\n\n.auth-card {\n background: var(--surface);\n border: 1px solid var(--border-light);\n border-radius: var(--radius);\n padding: 2.75rem 2.5rem;\n width: 100%;\n max-width: 400px;\n box-shadow: var(--shadow-lg);\n position: relative;\n z-index: 1;\n}\n\n/* ── Kikko Logo Lockup ── */\n.auth-logo {\n display: flex;\n align-items: center;\n justify-content: center;\n margin-bottom: 1.75rem;\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: 700;\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(--brand); box-shadow: 0 0 0 3px var(--brand-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: 700;\n font-family: var(--font);\n font-style: normal !important;\n transition: all var(--transition);\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(--brand); color: #1a1608; width: 100%; margin-top: 0.35rem; letter-spacing: 0.01em; }\n.btn-primary:hover:not(:disabled) { background: var(--accent2); box-shadow: 0 6px 24px var(--brand-glow); 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(--brand); cursor: pointer; font-weight: 700; 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: var(--sidebar-w) 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 box-shadow: 4px 0 20px rgba(0,0,0,0.2);\n}\n\n.sidebar-header {\n padding: 1.1rem 1rem 0.95rem;\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 lockup ── */\n.sidebar-logo-wrap {\n display: flex;\n align-items: center;\n flex: 1;\n min-width: 0;\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.4rem;\n font-weight: 800;\n font-style: normal !important;\n}\n\n.room-item {\n display: flex;\n align-items: center;\n gap: 0.55rem;\n padding: 0.52rem 0.7rem;\n border-radius: var(--radius-xs);\n cursor: pointer;\n font-size: 0.875rem;\n font-weight: 600;\n color: var(--text-muted);\n transition: all 0.12s;\n margin-bottom: 2px;\n font-style: normal !important;\n}\n\n.room-item:hover { background: var(--surface2); color: var(--text); }\n.room-item.active { background: var(--brand-soft); color: var(--brand); font-weight: 700; }\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.875rem;\n border-top: 1px solid var(--border);\n display: flex;\n flex-direction: column;\n gap: 0.2rem;\n flex-shrink: 0;\n background: var(--surface);\n}\n\n.user-pill {\n display: flex;\n align-items: center;\n gap: 0.6rem;\n padding: 0.5rem 0.4rem;\n border-radius: var(--radius-xs);\n cursor: pointer;\n transition: background var(--transition);\n min-width: 0;\n}\n\n.user-pill:hover { background: var(--surface2); }\n\n.user-pill .avatar {\n width: 34px;\n height: 34px;\n border-radius: 50%;\n background: var(--brand);\n display: flex;\n align-items: center;\n justify-content: center;\n font-weight: 800;\n font-size: 0.72rem;\n overflow: hidden;\n flex-shrink: 0;\n color: #1a1608;\n box-shadow: 0 0 0 2px var(--brand-soft);\n}\n.user-pill .avatar img { width: 100%; height: 100%; object-fit: cover; }\n.user-pill .uname {\n font-size: 0.875rem;\n font-weight: 700;\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n min-width: 0;\n}\n\n/* Admin badge */\n.admin-badge {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 3px;\n font-size: 0.65rem;\n background: var(--brand);\n color: #1a1608;\n padding: 0.15rem 0.5rem;\n border-radius: 99px;\n font-weight: 800;\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.admin-badge svg {\n width: 0.65em;\n height: 0.65em;\n flex-shrink: 0;\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.42rem 0.625rem;\n font-size: 0.825rem;\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 var(--transition);\n font-family: var(--font);\n font-weight: 600;\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: 1rem 1.75rem;\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 box-shadow: 0 2px 12px rgba(0,0,0,0.15);\n}\n\n.chat-header-info { flex: 1; min-width: 0; }\n.chat-header-name {\n font-weight: 800;\n font-size: 0.975rem;\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.72rem;\n color: var(--text-dim);\n margin-top: 2px;\n font-weight: 500;\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: 1.25rem 1.75rem 0.75rem;\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.5rem 0 0.875rem;\n}\n.date-divider::before, .date-divider::after {\n content: '';\n flex: 1;\n height: 1px;\n background: var(--border);\n opacity: 0.5;\n}\n.date-divider span {\n font-size: 0.7rem;\n color: var(--text-dim);\n white-space: nowrap;\n padding: 0.2rem 0.7rem;\n background: var(--surface2);\n border-radius: 99px;\n font-weight: 700;\n letter-spacing: 0.03em;\n font-style: normal !important;\n}\n\n/* ─── Message Bubbles ────────────────────────── */\n.msg-row {\n display: flex;\n align-items: flex-start;\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.msg-row.own { flex-direction: row-reverse; justify-content: flex-start; }\n.msg-row.other { flex-direction: row; justify-content: flex-start; }\n.msg-row.group-start { margin-top: 1rem; }\n\n.msg-avatar {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n background: var(--brand);\n display: flex;\n align-items: center;\n justify-content: center;\n font-weight: 800;\n font-size: 0.7rem;\n flex-shrink: 0;\n overflow: hidden;\n color: #1a1608;\n align-self: flex-start;\n margin-top: 2px;\n}\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 { 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-row { will-change: transform; }\n.msg-row.snapping { transition: transform 0.32s cubic-bezier(0.34,1.56,0.64,1); }\n\n.msg-meta {\n display: flex;\n align-items: baseline;\n gap: 0.4rem;\n margin-bottom: 0.25rem;\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.8rem;\n font-weight: 800;\n color: var(--text-muted);\n font-style: normal !important;\n}\n.msg-meta .username.is-admin { color: var(--brand); }\n.msg-meta .time {\n font-size: 0.68rem;\n color: var(--text-dim);\n font-style: normal !important;\n}\n\n.msg-bubble {\n padding: 0.6rem 1rem;\n border-radius: var(--radius-sm);\n font-size: 0.9rem;\n line-height: 1.65;\n word-break: break-word;\n font-style: normal !important;\n}\n\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 box-shadow: 0 1px 4px rgba(0,0,0,0.18);\n}\n\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 box-shadow: 0 1px 4px rgba(0,0,0,0.18);\n}\n\n.msg-bubble .mention { color: var(--brand); font-weight: 800; 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.6rem 0.9rem;\n cursor: pointer;\n transition: all var(--transition);\n min-width: 180px;\n}\n.blob-file:hover { border-color: var(--brand); background: var(--brand-soft); }\n.blob-file-icon { color: var(--brand); 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: 700; color: var(--brand); 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.875rem 1.75rem 1.1rem;\n border-top: 1px solid var(--border);\n background: var(--surface);\n flex-shrink: 0;\n box-shadow: 0 -2px 12px rgba(0,0,0,0.15);\n}\n\n.input-wrapper {\n display: flex;\n align-items: flex-end;\n gap: 0.5rem;\n background: var(--surface2);\n border: 1.5px solid var(--border);\n border-radius: var(--radius);\n padding: 0.55rem 0.65rem 0.55rem 1rem;\n transition: border-color 0.18s, box-shadow 0.18s;\n}\n.input-wrapper:focus-within { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-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.9rem;\n resize: none;\n max-height: 140px;\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 var(--transition);\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(--brand); }\n.icon-btn.send:hover { color: var(--accent2); background: var(--brand-soft); }\n.icon-btn.send:disabled { opacity: 0.35; cursor: not-allowed; }\n\n/* Character counter */\n.char-counter {\n font-size: 0.65rem;\n color: var(--text-dim);\n align-self: flex-end;\n padding-bottom: 0.1rem;\n padding-right: 0.1rem;\n flex-shrink: 0;\n transition: color var(--transition);\n}\n.char-counter.warn { color: var(--warn); }\n.char-counter.danger { color: var(--danger); font-weight: 700; }\n\n/* ─── Panel / Overlay ────────────────────────── */\n.panel-overlay {\n position: fixed; inset: 0;\n background: rgba(0,0,0,0.65);\n display: flex; align-items: center; justify-content: center;\n z-index: 50;\n backdrop-filter: blur(10px);\n -webkit-backdrop-filter: blur(10px);\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: 800; font-style: normal !important; }\n.settings-section { margin-bottom: 1.5rem; }\n.settings-section h3 {\n font-size: 0.68rem;\n font-weight: 800;\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.45rem 0.5rem;\n border-radius: var(--radius-xs);\n margin-bottom: 2px;\n transition: background var(--transition);\n}\n.member-row:hover { background: var(--surface2); }\n.member-row .mname { flex: 1; font-size: 0.875rem; font-weight: 600; 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: 250px;\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.22s cubic-bezier(0.34,1.2,0.64,1);\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: 800;\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.45rem 0.5rem;\n border-radius: var(--radius-xs);\n font-size: 0.84rem;\n margin-bottom: 1px;\n font-style: normal !important;\n transition: background var(--transition);\n}\n.user-row:hover { background: var(--surface2); }\n.user-mini-avatar {\n width: 28px; height: 28px;\n border-radius: 50%;\n background: var(--brand);\n display: flex; align-items: center; justify-content: center;\n font-size: 0.64rem; font-weight: 800; color: #1a1608;\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: 800;\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(42,45,56,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(--brand); }\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: 1rem 1.75rem;\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 box-shadow: 0 2px 12px rgba(0,0,0,0.15);\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: 800; font-size: 0.975rem; font-style: normal !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n.ai-header-model {\n font-size: 0.7rem;\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-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: 290px;\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.8rem 1rem;\n cursor: pointer;\n transition: background var(--transition);\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(--brand-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.875rem; font-weight: 700; 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.5rem;\n display: flex;\n flex-direction: column;\n gap: 1rem;\n}\n\n.ai-msg { display: flex; gap: 0.4rem; animation: msgIn 0.16s ease; align-items: flex-end; justify-content: flex-start; }\n.ai-msg.user { flex-direction: row-reverse; }\n\n.ai-avatar {\n width: 32px; height: 32px;\n border-radius: 50%;\n display: flex; align-items: center; justify-content: center;\n flex-shrink: 0;\n align-self: flex-start;\n overflow: hidden;\n margin-top: 2px;\n}\n.ai-avatar.mistral { background: transparent; }\n.ai-avatar.user { background: var(--brand); color: #1a1608; font-weight: 800; font-size: 0.7rem; }\n\n.ai-bubble {\n max-width: 78%;\n padding: 0.65rem 0.95rem;\n border-radius: var(--radius-sm);\n font-size: 0.875rem;\n line-height: 1.68;\n font-style: normal !important;\n}\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); }\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.875rem 1.75rem 1.1rem;\n border-top: 1px solid var(--border);\n background: var(--surface);\n display: flex;\n gap: 0.5rem;\n box-shadow: 0 -2px 12px rgba(0,0,0,0.15);\n}\n\n/* ─── AI Markdown rendering ────────────────────── */\n.ai-bubble strong { font-weight: 800; color: var(--text); }\n.ai-bubble em { font-style: italic !important; color: var(--text-muted); }\n.ai-bubble code {\n background: var(--surface2); border: 1px solid var(--border);\n border-radius: 4px; padding: 0.1rem 0.35rem; font-size: 0.82em;\n font-family: 'SF Mono', 'Fira Code', 'Cascadia Code', monospace;\n color: var(--brand);\n}\n.ai-bubble pre {\n background: var(--surface2); border: 1px solid var(--border);\n border-radius: 0 0 var(--radius-xs) var(--radius-xs); padding: 0.65rem 0.85rem;\n margin: 0; overflow-x: auto; font-size: 0.82em;\n line-height: 1.55;\n}\n.ai-bubble pre code {\n background: none; border: none; padding: 0; font-size: inherit; color: var(--text);\n}\n.code-block-wrap {\n margin: 0.45rem 0; border-radius: var(--radius-xs); border: 1px solid var(--border);\n overflow: hidden;\n}\n.code-block-wrap pre { border: none; border-radius: 0; }\n.code-block-header {\n display: flex; align-items: center; justify-content: space-between;\n padding: 0.3rem 0.75rem; background: var(--surface3);\n border-bottom: 1px solid var(--border); font-size: 0.72rem;\n}\n.code-block-lang {\n color: var(--text-dim); font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em;\n}\n.code-copy-btn {\n display: flex; align-items: center; gap: 0.25rem;\n background: none; border: none; cursor: pointer;\n color: var(--text-muted); font-size: 0.72rem; font-weight: 700;\n padding: 0.15rem 0.45rem; border-radius: var(--radius-xs);\n transition: background var(--transition), color var(--transition);\n}\n.code-copy-btn:hover { background: var(--surface2); color: var(--brand); }\n.ai-bubble blockquote {\n border-left: 3px solid var(--brand); margin: 0.4rem 0;\n padding: 0.25rem 0.75rem; color: var(--text-muted);\n background: var(--brand-soft); border-radius: 0 var(--radius-xs) var(--radius-xs) 0;\n}\n.ai-bubble ul, .ai-bubble ol {\n margin: 0.35rem 0; padding-left: 1.4rem;\n}\n.ai-bubble li { margin-bottom: 0.2rem; }\n.ai-bubble h1, .ai-bubble h2, .ai-bubble h3 {\n font-weight: 800; margin: 0.6rem 0 0.3rem; line-height: 1.4;\n font-style: normal !important;\n}\n.ai-bubble h1 { font-size: 1.1em; }\n.ai-bubble h2 { font-size: 1em; }\n.ai-bubble h3 { font-size: 0.92em; color: var(--text-muted); }\n.ai-bubble hr {\n border: none; border-top: 1px solid var(--border); margin: 0.5rem 0;\n}\n.ai-bubble p { margin: 0.25rem 0; }\n.ai-bubble p:first-child { margin-top: 0; }\n.ai-bubble p:last-child { margin-bottom: 0; }\n.ai-bubble a {\n color: var(--brand); text-decoration: underline;\n text-decoration-color: rgba(252,220,93,0.4);\n}\n.ai-bubble a:hover { text-decoration-color: var(--brand); }\n\n.ai-msg { animation: aiMsgIn 0.3s cubic-bezier(0.34,1.3,0.64,1); }\n@keyframes aiMsgIn { from { opacity:0; transform:translateY(12px) scale(0.97); } to { opacity:1; transform:none; } }\n\n.ai-disclaimer {\n padding: 0.35rem 1.5rem;\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/* ─── Pasted Content Chip ────────────────────── */\n.pasted-chip {\n background: var(--surface2);\n border: 1px solid var(--border);\n border-radius: var(--radius-sm);\n margin-bottom: 0.5rem;\n overflow: hidden;\n animation: fadeIn 0.15s ease;\n}\n.pasted-chip-header {\n display: flex;\n align-items: center;\n gap: 0.45rem;\n padding: 0.35rem 0.65rem;\n font-size: 0.78rem;\n font-weight: 700;\n color: var(--text-muted);\n border-bottom: 1px solid var(--border);\n}\n.pasted-chip-header svg { flex-shrink: 0; width: 14px; height: 14px; opacity: 0.6; }\n.pasted-chip-size {\n font-weight: 500;\n font-size: 0.7rem;\n color: var(--text-dim);\n}\n.pasted-chip-preview {\n padding: 0.45rem 0.65rem;\n font-size: 0.75rem;\n color: var(--text-muted);\n max-height: 80px;\n overflow: hidden;\n margin: 0;\n white-space: pre-wrap;\n word-break: break-all;\n font-family: 'SF Mono', 'Fira Code', 'Cascadia Code', monospace;\n line-height: 1.45;\n background: var(--surface);\n}\n\n/* ─── Streaming cursor blink ─────────────────── */\n.ai-bubble.streaming::after {\n content: '\\25CE';\n display: inline;\n animation: cursorBlink 0.8s step-end infinite;\n color: var(--brand);\n font-weight: 300;\n}\n@keyframes cursorBlink { 0%,100% { opacity:1; } 50% { opacity:0; } }\n\n/* ─── Loading Screen ─────────────────────────── */\n.loading-screen {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n position: fixed;\n inset: 0;\n z-index: 9999;\n background: var(--bg);\n transition: opacity 0.28s ease;\n}\n.loading-screen.fade-out {\n opacity: 0;\n pointer-events: none;\n}\n.loading-letters {\n display: flex;\n gap: 0.05rem;\n}\n.loading-letter {\n font-family: var(--font);\n font-size: 4rem;\n font-weight: 900;\n color: var(--brand);\n opacity: 0;\n transform: translateY(-40px);\n animation: letterDrop 0.38s cubic-bezier(0.34,1.5,0.64,1) forwards, letterGlow 0.35s ease 0.55s forwards;\n text-shadow: none;\n letter-spacing: -0.02em;\n}\n@keyframes letterDrop {\n 0% { opacity: 0; transform: translateY(-40px) scale(0.75); }\n 100% { opacity: 1; transform: translateY(0) scale(1); }\n}\n@keyframes letterGlow {\n 0% { text-shadow: none; }\n 50% { text-shadow: 0 0 28px var(--brand-glow), 0 0 56px var(--brand-glow); }\n 100% { text-shadow: 0 0 10px rgba(255,218,74,0.3); }\n}\n@keyframes spin { to { transform: rotate(360deg) } }\n@keyframes loadingPulse { 0%,100% { opacity:0.6 } 50% { opacity:1 } }\n\n/* ─── Button Spinner ─────────────────────────── */\n.btn-spinner { display: inline-block; width: 14px; height: 14px; border: 2px solid rgba(26,22,8,0.3); border-top-color: #1a1608; border-radius: 50%; animation: spin .7s linear infinite; vertical-align: middle; margin-right: 6px; }\n\n/* ─── Bookmarklet page ───────────────────────── */\n.bm-page { max-width: 580px; width: 100%; }\n\n/* ─── Light mode ─────────────────────────────── */\nbody.light {\n --logo-fill: #1a1608;\n --bg: #faf9f2;\n --surface: #ffffff;\n --surface2: #f5f3e8;\n --surface3: #ede9d8;\n --border: #e0dbc8;\n --border-light: #d4ceb8;\n --text: #1a1608;\n --text-muted: #5a5440;\n --text-dim: #9a9178;\n --msg-own: rgba(252,220,93,0.15);\n --msg-own-border: rgba(232,200,50,0.35);\n --shadow: 0 4px 24px rgba(200,185,100,0.18);\n --shadow-lg: 0 32px 64px rgba(200,185,100,0.2), 0 0 0 1px rgba(0,0,0,0.04);\n}\nbody.light .auth-screen::before { background: radial-gradient(circle,rgba(200,170,30,0.25) 0%,transparent 70%); }\nbody.light .auth-toggle button { color: #8a7400; }\nbody.light .auth-toggle button:hover { color: #6b5a00; }\nbody.light .msg-meta .username.is-admin { color: #8a7400; }\nbody.light .room-item.active { color: #6b5a00; }\nbody.light .reply-bar-user,\nbody.light .reply-quote-user,\nbody.light .search-result-user { color: #8a7400; }\nbody.light .msg-bubble .mention { color: #8a7400; }\nbody.light .msg-row.other .msg-bubble { background: #fff; }\nbody.light .ai-msg.assistant .ai-bubble { background: #fff; }\nbody.light .online-dot { box-shadow: 0 0 0 2px #fff; }\nbody.light input[type=\"text\"],\nbody.light input[type=\"email\"],\nbody.light input[type=\"password\"],\nbody.light input[type=\"number\"] { background: #f8f6ea; }\n/* Light mode: make logo/brand text dark for readability */\nbody.light .auth-logo svg,\nbody.light .sidebar-logo-wrap svg,\nbody.light .empty-state svg { --brand-fill: #1a1608; }\nbody.light .auth-logo svg { color: #1a1608; }\nbody.light .loading-letter { color: #1a1608; text-shadow: none; }\nbody.light .loading-letter { animation: letterDrop 0.38s cubic-bezier(0.34,1.5,0.64,1) forwards, letterGlowLight 0.35s ease 0.55s forwards; }\n@keyframes letterGlowLight {\n 0% { text-shadow: none; }\n 50% { text-shadow: 0 0 16px rgba(200,170,30,0.4), 0 0 32px rgba(200,170,30,0.2); }\n 100% { text-shadow: 0 0 6px rgba(200,170,30,0.15); }\n}\n\n/* ─── Message action bar ─────────────────────── */\n.icon { display:inline-flex;align-items:center;justify-content:center; }\n.reaction-picker { position:absolute;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:0.35rem 0.5rem;display:flex;gap:0.2rem;z-index:50;box-shadow:0 8px 32px rgba(0,0,0,0.45);animation:fadeIn .13s ease; }\n.reaction-btn-pick { background:none;border:none;cursor:pointer;padding:0.2rem 0.25rem;border-radius:5px;transition:background .12s;display:flex;align-items:center;justify-content:center; }\n.reaction-btn-pick:hover { background:var(--surface2); }\n.reaction-btn-pick svg { display:block; }\n.msg-reactions-outer { pointer-events:auto; }\n.reaction-chip { display:inline-flex;align-items:center;gap:3px;padding:0.15rem 0.4rem;border-radius:99px;border:1px solid var(--border);background:var(--surface);box-shadow:0 2px 8px rgba(0,0,0,0.35);cursor:pointer;font-size:0.72rem;font-weight:700;color:var(--text-muted);transition:all .13s;user-select:none; }\n.reaction-chip:hover { border-color:var(--brand);color:var(--brand);box-shadow:0 2px 12px var(--brand-glow); }\n.reaction-chip.own { border-color:var(--brand);background:var(--brand-soft);color:var(--brand); }\n.reaction-chip svg { display:block;flex-shrink:0; }\n.reply-bar { display:flex;align-items:center;gap:0.6rem;background:var(--surface2);border-left:2.5px solid var(--brand);border-radius:0 var(--radius-xs) var(--radius-xs) 0;padding:0.45rem 0.75rem;margin-bottom:0.4rem;font-size:0.8rem; }\n.reply-bar-info { flex:1;min-width:0; }\n.reply-bar-user { font-weight:800;color:var(--brand);font-size:0.72rem;margin-bottom:1px; }\n.reply-bar-text { color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }\n.reply-quote { background:var(--surface3);border-left:2.5px solid var(--brand);border-radius:0 var(--radius-xs) var(--radius-xs) 0;padding:0.3rem 0.55rem;margin-bottom:0.4rem;font-size:0.77rem;cursor:pointer; }\n.reply-quote-user { font-weight:800;color:var(--brand);margin-bottom:1px; }\n.reply-quote-text { color:var(--text-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }\n.msg-bubble-wrap { position:relative;display:flex;flex-direction:row;align-items:flex-end;gap:0.4rem;overflow:visible; }\n.swipe-hint.row-hint { position:absolute;top:50%;left:8px;transform:translateY(-50%) scale(0.7);opacity:0;transition:opacity .12s,transform .12s;pointer-events:none;color:var(--brand);z-index:5; }\n.msg-action-bar {\n display:flex;flex-direction:row;align-items:center;gap:0.15rem;flex-shrink:0;\n background:var(--surface);border:1px solid var(--border);border-radius:99px;\n padding:0.25rem 0.4rem;box-shadow:0 4px 16px rgba(0,0,0,0.3);\n white-space:nowrap;\n max-width:0;overflow:hidden;opacity:0;pointer-events:none;\n transition:max-width 0.28s cubic-bezier(0.34,1.2,0.64,1),opacity 0.22s cubic-bezier(0.34,1.2,0.64,1),transform 0.28s cubic-bezier(0.34,1.4,0.64,1);\n}\n.msg-bubble-wrap:has(.msg-bubble-col.has-reactions) .msg-action-bar { margin-bottom:1.6rem; }\n.msg-row.own .msg-bubble-wrap .msg-action-bar { transform:translateX(12px) scale(0.92);order:-1; }\n.msg-row.other .msg-bubble-wrap .msg-action-bar { transform:translateX(-12px) scale(0.92);order:1; }\n.msg-action-bar.open { max-width:640px;overflow:hidden;opacity:1;pointer-events:auto;transform:translateX(0) scale(1); }\n.msg-bubble-col { position:relative;display:table;max-width:min(72vw,480px);min-width:0;transition:transform 0.28s cubic-bezier(0.34,1.2,0.64,1); }\n.msg-row.own .msg-action-bar.open~.msg-bubble-col { transform:translateX(6px); }\n.msg-row.other .msg-action-bar.open~.msg-bubble-col { transform:translateX(-6px); }\n.msg-bubble-col>.msg-reactions-outer { position:absolute;top:100%;margin-top:0.25rem;display:flex;flex-wrap:nowrap;gap:0.25rem;pointer-events:auto;z-index:2; }\n.msg-row.own .msg-bubble-col>.msg-reactions-outer { right:0;flex-direction:row-reverse; }\n.msg-row.other .msg-bubble-col>.msg-reactions-outer { left:0;flex-direction:row; }\n.msg-bubble-col.has-reactions { margin-bottom:1.6rem; }\n.msg-action-react-btn { background:none;border:none;cursor:pointer;padding:0.2rem 0.25rem;border-radius:6px;transition:transform .1s,background .1s;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent; }\n.msg-action-react-btn:active,.msg-action-react-btn.active { background:var(--brand-soft);transform:scale(1.25); }\n.msg-action-bar-sep { width:1px;height:18px;background:var(--border);margin:0 0.2rem;flex-shrink:0; }\n.msg-action-btn { display:flex;align-items:center;gap:0.25rem;padding:0.25rem 0.55rem;background:none;border:none;border-radius:99px;font-size:0.78rem;color:var(--text-muted);cursor:pointer;transition:background .1s,color .1s;-webkit-tap-highlight-color:transparent;white-space:nowrap; }\n.msg-action-btn:active { background:var(--surface2);color:var(--text); }\n.msg-action-bar.open > *:nth-child(1) { animation:btnIn 0.2s cubic-bezier(0.34,1.5,0.64,1) 0.03s both; }\n.msg-action-bar.open > *:nth-child(2) { animation:btnIn 0.2s cubic-bezier(0.34,1.5,0.64,1) 0.06s both; }\n.msg-action-bar.open > *:nth-child(3) { animation:btnIn 0.2s cubic-bezier(0.34,1.5,0.64,1) 0.09s both; }\n.msg-action-bar.open > *:nth-child(4) { animation:btnIn 0.2s cubic-bezier(0.34,1.5,0.64,1) 0.12s both; }\n.msg-action-bar.open > *:nth-child(5) { animation:btnIn 0.2s cubic-bezier(0.34,1.5,0.64,1) 0.15s both; }\n.msg-action-bar.open > *:nth-child(6) { animation:btnIn 0.2s cubic-bezier(0.34,1.5,0.64,1) 0.18s both; }\n.msg-action-bar.open > *:nth-child(7) { animation:btnIn 0.2s cubic-bezier(0.34,1.5,0.64,1) 0.21s both; }\n.msg-action-bar.open > *:nth-child(8) { animation:btnIn 0.2s cubic-bezier(0.34,1.5,0.64,1) 0.24s both; }\n.msg-action-bar.open > *:nth-child(9) { animation:btnIn 0.2s cubic-bezier(0.34,1.5,0.64,1) 0.27s both; }\n.msg-action-bar.open > *:nth-child(10) { animation:btnIn 0.2s cubic-bezier(0.34,1.5,0.64,1) 0.30s both; }\n.msg-action-bar.open > *:nth-child(11) { animation:btnIn 0.2s cubic-bezier(0.34,1.5,0.64,1) 0.33s both; }\n@keyframes btnIn { from{opacity:0;transform:scale(0.7);}to{opacity:1;transform:scale(1);} }\n@keyframes ctxPop { from{opacity:0;transform:scale(0.88)}to{opacity:1;transform:scale(1)} }\n.confirm-overlay { position:fixed;inset:0;background:rgba(0,0,0,0.65);z-index:200;display:flex;align-items:center;justify-content:center;animation:fadeIn .15s ease; }\n.confirm-box { background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.75rem;max-width:320px;width:90%;text-align:center;animation:ctxPop .2s cubic-bezier(0.34,1.4,0.64,1); }\n.confirm-box h3 { margin:0 0 0.5rem;font-size:1rem;font-weight:800; }\n.confirm-box p { font-size:0.85rem;color:var(--text-muted);margin:0 0 1.2rem; }\n.confirm-actions { display:flex;gap:0.6rem;justify-content:center; }\n.confirm-actions button { padding:0.5rem 1.2rem;border-radius:var(--radius-sm);border:none;cursor:pointer;font-size:0.875rem;font-weight:700;transition:opacity .15s; }\n.confirm-actions .btn-cancel { background:var(--surface2);color:var(--text); }\n.confirm-actions .btn-danger { background:var(--danger);color:#fff; }\n.confirm-actions button:active { opacity:0.75; }\n.scroll-to-bottom { position:absolute;bottom:1rem;left:50%;z-index:30;width:34px;height:34px;border-radius:50%;background:var(--brand);color:#1a1608;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px var(--brand-glow);transform:translate(-50%,0);animation:fadeInUp .2s cubic-bezier(0.34,1.4,0.64,1) both;will-change:transform;padding:0; }\n.scroll-to-bottom:hover { transform:translate(-50%,0) scale(1.1); }\n.scroll-to-bottom:active { transform:translate(-50%,0) scale(0.93); }\n@keyframes fadeInUp { from{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%,0)} }\n@keyframes msgSlideIn { from{opacity:0;transform:translateY(18px) scale(0.97)}to{opacity:1;transform:translateY(0) scale(1)} }\n.msg-row.new-msg { animation:msgSlideIn .28s cubic-bezier(0.34,1.4,0.64,1); }\n@keyframes slideInRight { from{opacity:0;transform:translateX(32px)}to{opacity:1;transform:translateX(0)} }\n.panel-anim { animation:slideInRight .22s cubic-bezier(0.34,1.4,0.64,1); }\n@keyframes chipPop { from{transform:scale(0.6)}to{transform:scale(1)} }\n.reaction-chip { animation:chipPop .18s cubic-bezier(0.34,1.56,0.64,1); }\n.edit-textarea { width:100%;background:var(--surface2);border:1px solid var(--brand);border-radius:var(--radius-xs);padding:0.4rem 0.6rem;color:var(--text);font-size:0.875rem;font-family:var(--font);resize:none;outline:none;min-height:36px; }\n.edit-actions { display:flex;gap:0.35rem;margin-top:0.3rem; }\n.edited-tag { font-size:0.65rem;color:var(--text-dim);margin-left:0.4rem;cursor:pointer;display:inline-flex;align-items:center;gap:0.2rem;transition:color .13s;text-decoration:underline;text-decoration-style:dotted; }\n.edited-tag:hover { color:var(--text-muted); }\n.original-popover { position:absolute;z-index:40;bottom:calc(100% + 8px);max-width:min(320px,80vw);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:0.6rem 0.75rem;box-shadow:0 8px 32px rgba(0,0,0,0.45);animation:origPop .18s cubic-bezier(0.34,1.4,0.64,1); }\n.msg-row.own .original-popover { right:0; }\n.msg-row.other .original-popover { left:0; }\n@keyframes origPop { from{opacity:0;transform:translateY(6px) scale(0.95)}to{opacity:1;transform:none} }\n.original-popover-label { font-size:0.62rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--text-dim);margin-bottom:0.3rem; }\n.original-popover-text { font-size:0.82rem;color:var(--text-muted);line-height:1.5;word-break:break-word; }\n.original-popover-arrow { position:absolute;bottom:-5px;width:10px;height:10px;background:var(--surface);border-right:1px solid var(--border);border-bottom:1px solid var(--border);transform:rotate(45deg); }\n.msg-row.own .original-popover-arrow { right:14px; }\n.msg-row.other .original-popover-arrow { left:14px; }\n.edit-expired { font-size:0.68rem;color:var(--text-dim);padding:0.2rem 0.3rem;font-style:normal!important; }\n.link-preview { background:var(--surface2);border:1px solid var(--border);border-left:2.5px solid var(--brand);border-radius:var(--radius-xs);padding:0.55rem 0.75rem;margin-top:0.4rem;cursor:pointer;transition:border-color .15s;max-width:320px; }\n.link-preview:hover { border-color:var(--accent2); }\n.link-preview-site { font-size:0.68rem;color:var(--text-dim);margin-bottom:2px;font-weight:700;text-transform:uppercase;letter-spacing:.04em; }\n.link-preview-title { font-size:0.82rem;font-weight:800;color:var(--text);margin-bottom:2px;line-height:1.3; }\n.link-preview-desc { font-size:0.75rem;color:var(--text-muted);line-height:1.4;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical; }\n.link-preview-img { width:100%;max-height:120px;object-fit:cover;border-radius:4px;margin-top:0.4rem; }\n.typing-bar { height:22px;display:flex;align-items:center;gap:0.4rem;padding:0 1.375rem;font-size:0.74rem;color:var(--text-dim); }\n.typing-dots { display:flex;gap:3px;align-items:center; }\n.typing-dots span { width:4px;height:4px;border-radius:50%;background:var(--text-dim);animation:typingDot 1.4s ease infinite; }\n.typing-dots span:nth-child(2) { animation-delay:.2s; }\n.typing-dots span:nth-child(3) { animation-delay:.4s; }\n.search-panel { position:absolute;top:0;left:0;right:0;bottom:0;background:var(--bg);z-index:30;display:flex;flex-direction:column;animation:fadeIn .15s ease; }\n.search-header { padding:.875rem 1.375rem;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:.75rem;background:var(--surface); }\n.search-results { flex:1;overflow-y:auto;padding:.75rem 1.375rem;display:flex;flex-direction:column;gap:.5rem; }\n.search-result-item { background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.65rem .875rem;cursor:pointer;transition:border-color .13s; }\n.search-result-item:hover { border-color:var(--brand); }\n.search-result-user { font-size:.75rem;font-weight:800;color:var(--brand);margin-bottom:3px; }\n.search-result-text { font-size:.85rem;color:var(--text);line-height:1.4; }\n.search-result-time { font-size:.68rem;color:var(--text-dim);margin-top:2px; }\n.unread-badge { background:var(--brand);color:#1a1608;border-radius:99px;font-size:.62rem;font-weight:800;padding:.08rem .38rem;min-width:16px;text-align:center;line-height:1.5;flex-shrink:0; }\n.theme-btn { background:none;border:none;cursor:pointer;color:var(--text-dim);padding:.35rem;border-radius:var(--radius-xs);transition:color .13s;display:flex;align-items:center; }\n.theme-btn:hover { color:var(--brand); }\n.admin-action-row { display:flex;align-items:center;gap:0.5rem;margin:0.4rem 0;padding:0.3rem 0.5rem;background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius-xs); }\n.admin-action-label { font-size:0.8rem;color:var(--text-muted);font-family:monospace;flex:1;min-width:0;word-break:break-all; }\n.admin-action-label code { background:var(--surface3);border-radius:3px;padding:0.05rem 0.3rem;font-size:0.77rem;color:var(--text); }\n.admin-exec-btn { flex-shrink:0;font-size:0.72rem!important;padding:0.2rem 0.55rem!important;display:flex;align-items:center;gap:0.25rem; }\n.admin-exec-btn.done { background:var(--surface3)!important;color:var(--text-muted)!important;border-color:var(--border)!important; }\n.blob-img-wrap { display:flex;flex-direction:column;gap:0.35rem;cursor:pointer; }\n.blob-img-wrap img { max-width:min(260px,60vw);max-height:200px;object-fit:cover;border-radius:var(--radius-xs);display:block; }\n.blob-img-name { font-size:0.7rem;color:var(--text-dim); }\n.blob-img-loading { width:min(260px,60vw);height:120px;background:var(--surface2);border-radius:var(--radius-xs);display:flex;align-items:center;justify-content:center;color:var(--text-dim);font-size:0.75rem; }\n.blob-expired { display:flex;flex-direction:column;align-items:center;gap:0.25rem;padding:0.55rem 0.9rem;background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius-xs);opacity:0.6; }\n.blob-expired-label { font-size:0.7rem;color:var(--danger);font-weight:700;letter-spacing:.03em; }\n.blob-expired-name { font-size:0.7rem;color:var(--text-dim); }\n\n/* ─── Responsive (mobile) ────────────────────── */\n@media (max-width: 640px) {\n .app-layout {\n grid-template-columns: 1fr;\n grid-template-rows: 1fr;\n }\n .sidebar {\n position: fixed;\n left: 0; top: 0; bottom: 0;\n width: 80vw;\n max-width: 280px;\n z-index: 60;\n transform: translateX(-100%);\n transition: transform 0.25s cubic-bezier(0.34,1.2,0.64,1);\n box-shadow: 12px 0 40px rgba(0,0,0,0.4);\n }\n .sidebar.mobile-open { transform: translateX(0); }\n .mobile-menu-btn {\n display: flex !important;\n position: fixed;\n top: 0.75rem;\n left: 0.75rem;\n z-index: 55;\n background: var(--surface);\n border: 1px solid var(--border);\n border-radius: var(--radius-xs);\n padding: 0.4rem;\n box-shadow: var(--shadow);\n }\n .messages-container { padding: 0.875rem 1rem 0.5rem; }\n .message-input-area { padding: 0.65rem 1rem 0.875rem; }\n .ai-messages { padding: 1rem; }\n .ai-input-area { padding: 0.65rem 1rem 0.875rem; }\n .chat-header { padding: 0.875rem 1rem 0.875rem 3.75rem; }\n .ai-header { padding: 0.875rem 1rem 0.875rem 3.75rem; }\n}\n.mobile-menu-btn { display: none; }\n\n.sidebar {\n transition: transform 0.25s cubic-bezier(0.34,1.2,0.64,1);\n}\n",[],[165,250],"0b263eac-39bc-11f1-b179-42b51c65c3df","index.tsx","019d9765-c687-762d-97e2-726a97ecc9bc",["D",1776361522677],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\n// Kikko frontend — this file is loaded as a module from index.html\n// It contains the full React SPA for the chat application.\n// Due to the size of this file, the actual frontend code needs to be\n// placed here. For now this is a placeholder that will be populated.\nexport {};\n",[],[165,257],"f06aacb4-39bc-11f1-8e30-42b51c65c3df","index.html","019d9765-c687-762d-97e2-6ebd0be6c3f7",["D",1776361907504],3,[],[165,264],"8cf42e1c-39bc-11f1-bbbf-42b51c65c3df","icons.ts","8cf42ebc-39bc-11f1-bbbf-42b51c65c3df",4,["D",1776361740654],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createElement as h } from \"react\";\n\n// ── SVG Reaction emojis as colored vectors ───────────────────────────────────\nexport const REACTIONS = [\n { emoji: \"👍\", label: \"thumbs up\", svg: () => h(\"svg\", { width: 16, height: 16, viewBox: \"0 0 24 24\", fill: \"none\" }, h(\"path\", { d: \"M7 22H4a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2h3m7-10v4a2 2 0 0 1-2 2H9l-2 5v1h10l1.5-7H14V2z\", fill: \"#FBBF24\", stroke: \"#D97706\", strokeWidth: 1.2, strokeLinejoin: \"round\" })) },\n { emoji: \"❤️\", label: \"heart\", svg: () => h(\"svg\", { width: 16, height: 16, viewBox: \"0 0 24 24\", fill: \"none\" }, h(\"path\", { d: \"M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z\", fill: \"#EF4444\", stroke: \"#DC2626\", strokeWidth: 1 })) },\n { emoji: \"😂\", label: \"laugh\", svg: () => h(\"svg\", { width: 16, height: 16, viewBox: \"0 0 24 24\", fill: \"none\" }, h(\"circle\", { cx: 12, cy: 12, r: 10, fill: \"#FBBF24\", stroke: \"#D97706\", strokeWidth: 1 }), h(\"path\", { d: \"M8 14s1.5 2 4 2 4-2 4-2\", stroke: \"#92400E\", strokeWidth: 1.5, strokeLinecap: \"round\" }), h(\"circle\", { cx: 9, cy: 10, r: 1, fill: \"#92400E\" }), h(\"circle\", { cx: 15, cy: 10, r: 1, fill: \"#92400E\" }), h(\"path\", { d: \"M6 8c0 0 1-2 3-1M18 8c0 0-1-2-3-1\", stroke: \"#D97706\", strokeWidth: 1, strokeLinecap: \"round\" })) },\n { emoji: \"😮\", label: \"wow\", svg: () => h(\"svg\", { width: 16, height: 16, viewBox: \"0 0 24 24\", fill: \"none\" }, h(\"circle\", { cx: 12, cy: 12, r: 10, fill: \"#FBBF24\", stroke: \"#D97706\", strokeWidth: 1 }), h(\"ellipse\", { cx: 12, cy: 15, rx: 2.5, ry: 3, fill: \"#92400E\" }), h(\"circle\", { cx: 9, cy: 10, r: 1, fill: \"#92400E\" }), h(\"circle\", { cx: 15, cy: 10, r: 1, fill: \"#92400E\" })) },\n { emoji: \"🔥\", label: \"fire\", svg: () => h(\"svg\", { width: 16, height: 16, viewBox: \"0 0 24 24\", fill: \"none\" }, h(\"path\", { d: \"M12 2c0 0-4 4-4 9a4 4 0 0 0 8 0c0-2-1-4-2-5 0 0 0 3-2 3s-2-3-2-3c0 3-2 4-2 4 0-5 4-8 4-8z\", fill: \"#F97316\", stroke: \"#EA580C\", strokeWidth: .5 }), h(\"path\", { d: \"M12 22c-2.76 0-5-2.24-5-5 0-2.5 1.5-4 2-5 0 0 .5 2 2 2s2-2 2-2c.5 1 1 2.5 1 4 0 1-.5 2-1 2 1.5-.5 2-2 2-3.5 1 1.5 1 3.5 0 5-.55 1-1.45 2-3 2.5z\", fill: \"#FCD34D\", stroke: \"#FBBF24\", strokeWidth: .5 })) },\n { emoji: \"👀\", label: \"eyes\", svg: () => h(\"svg\", { width: 16, height: 16, viewBox: \"0 0 24 24\", fill: \"none\" }, h(\"ellipse\", { cx: 7, cy: 12, rx: 4, ry: 3, fill: \"#fff\", stroke: \"#374151\", strokeWidth: 1 }), h(\"circle\", { cx: 7, cy: 12, r: 1.5, fill: \"#1D4ED8\" }), h(\"ellipse\", { cx: 17, cy: 12, rx: 4, ry: 3, fill: \"#fff\", stroke: \"#374151\", strokeWidth: 1 }), h(\"circle\", { cx: 17, cy: 12, r: 1.5, fill: \"#1D4ED8\" })) },\n { emoji: \"🎉\", label: \"party\", svg: () => h(\"svg\", { width: 16, height: 16, viewBox: \"0 0 24 24\", fill: \"none\" }, h(\"path\", { d: \"M4 20L10 4\", stroke: \"#D97706\", strokeWidth: 2, strokeLinecap: \"round\" }), h(\"path\", { d: \"M4 20l8-4\", stroke: \"#D97706\", strokeWidth: 2, strokeLinecap: \"round\" }), h(\"circle\", { cx: 14, cy: 6, r: 2, fill: \"#EF4444\" }), h(\"circle\", { cx: 18, cy: 10, r: 1.5, fill: \"#8B5CF6\" }), h(\"circle\", { cx: 20, cy: 5, r: 1, fill: \"#10B981\" }), h(\"path\", { d: \"M12 14l2 2 4-4\", stroke: \"#FBBF24\", strokeWidth: 1.5, strokeLinecap: \"round\" })) },\n { emoji: \"💯\", label: \"100\", svg: () => h(\"svg\", { width: 16, height: 16, viewBox: \"0 0 24 24\", fill: \"none\" }, h(\"text\", { x: 1, y: 17, fontSize: 13, fontWeight: \"bold\", fill: \"#EF4444\", fontFamily: \"sans-serif\" }, \"💯\")) },\n];\n\n// ── SVG Icons ─────────────────────────────────────────────────────────────────\nexport const Ico = {\n huddle: () => h(\"svg\", { width: 20, height: 20, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"path\", { d: \"M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z\" })),\n world: () => h(\"svg\", { width: 14, height: 14, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"circle\", { cx: 12, cy: 12, r: 10 }), h(\"line\", { x1: 2, y1: 12, x2: 22, y2: 12 }), h(\"path\", { d: \"M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z\" })),\n lock: () => h(\"svg\", { width: 13, height: 13, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"rect\", { x: 3, y: 11, width: 18, height: 11, rx: 2, ry: 2 }), h(\"path\", { d: \"M7 11V7a5 5 0 0 1 10 0v4\" })),\n users: () => h(\"svg\", { width: 17, height: 17, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"path\", { d: \"M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2\" }), h(\"circle\", { cx: 9, cy: 7, r: 4 }), h(\"path\", { d: \"M23 21v-2a4 4 0 0 0-3-3.87\" }), h(\"path\", { d: \"M16 3.13a4 4 0 0 1 0 7.75\" })),\n send: () => h(\"svg\", { width: 17, height: 17, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"line\", { x1: 22, y1: 2, x2: 11, y2: 13 }), h(\"polygon\", { points: \"22 2 15 22 11 13 2 9 22 2\" })),\n attach: () => h(\"svg\", { width: 17, height: 17, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"path\", { d: \"M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48\" })),\n close: () => h(\"svg\", { width: 16, height: 16, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2.5, strokeLinecap: \"round\" }, h(\"line\", { x1: 18, y1: 6, x2: 6, y2: 18 }), h(\"line\", { x1: 6, y1: 6, x2: 18, y2: 18 })),\n plus: () => h(\"svg\", { width: 15, height: 15, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2.5, strokeLinecap: \"round\" }, h(\"line\", { x1: 12, y1: 5, x2: 12, y2: 19 }), h(\"line\", { x1: 5, y1: 12, x2: 19, y2: 12 })),\n settings: () => h(\"svg\", { width: 16, height: 16, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"circle\", { cx: 12, cy: 12, r: 3 }), h(\"path\", { d: \"M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z\" })),\n logout: () => h(\"svg\", { width: 16, height: 16, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"path\", { d: \"M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4\" }), h(\"polyline\", { points: \"16 17 21 12 16 7\" }), h(\"line\", { x1: 21, y1: 12, x2: 9, y2: 12 })),\n shield: () => h(\"svg\", { width: 15, height: 15, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"path\", { d: \"M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z\" })),\n file: () => h(\"svg\", { width: 18, height: 18, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"path\", { d: \"M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z\" }), h(\"polyline\", { points: \"13 2 13 9 20 9\" })),\n ghost: () => h(\"svg\", { width: 15, height: 15, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"path\", { d: \"M9 10h.01M15 10h.01M12 2a8 8 0 0 0-8 8v12l3-3 2.5 2.5L12 19l2.5 2.5L17 19l3 3V10a8 8 0 0 0-8-8z\" })),\n ai: () => h(\"svg\", { width: 16, height: 16, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"rect\", { x: 3, y: 3, width: 18, height: 18, rx: 3 }), h(\"path\", { d: \"M9 9h6M9 12h6M9 15h4\" })),\n trash: () => h(\"svg\", { width: 14, height: 14, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"polyline\", { points: \"3 6 5 6 21 6\" }), h(\"path\", { d: \"M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6\" }), h(\"path\", { d: \"M10 11v6M14 11v6\" }), h(\"path\", { d: \"M9 6V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2\" })),\n check: () => h(\"svg\", { width: 14, height: 14, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2.5, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"polyline\", { points: \"20 6 9 17 4 12\" })),\n user: () => h(\"svg\", { width: 16, height: 16, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"path\", { d: \"M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2\" }), h(\"circle\", { cx: 12, cy: 7, r: 4 })),\n reply: () => h(\"svg\", { width: 14, height: 14, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"polyline\", { points: \"9 17 4 12 9 7\" }), h(\"path\", { d: \"M20 18v-2a4 4 0 0 0-4-4H4\" })),\n edit: () => h(\"svg\", { width: 14, height: 14, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"path\", { d: \"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\" }), h(\"path\", { d: \"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\" })),\n search: () => h(\"svg\", { width: 16, height: 16, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"circle\", { cx: 11, cy: 11, r: 8 }), h(\"line\", { x1: 21, y1: 21, x2: 16.65, y2: 16.65 })),\n sun: () => h(\"svg\", { width: 16, height: 16, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"circle\", { cx: 12, cy: 12, r: 5 }), h(\"line\", { x1: 12, y1: 1, x2: 12, y2: 3 }), h(\"line\", { x1: 12, y1: 21, x2: 12, y2: 23 }), h(\"line\", { x1: 4.22, y1: 4.22, x2: 5.64, y2: 5.64 }), h(\"line\", { x1: 18.36, y1: 18.36, x2: 19.78, y2: 19.78 }), h(\"line\", { x1: 1, y1: 12, x2: 3, y2: 12 }), h(\"line\", { x1: 21, y1: 12, x2: 23, y2: 12 }), h(\"line\", { x1: 4.22, y1: 19.78, x2: 5.64, y2: 18.36 }), h(\"line\", { x1: 18.36, y1: 5.64, x2: 19.78, y2: 4.22 })),\n moon: () => h(\"svg\", { width: 16, height: 16, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"path\", { d: \"M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z\" })),\n smile: () => h(\"svg\", { width: 17, height: 17, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"circle\", { cx: 12, cy: 12, r: 10 }), h(\"path\", { d: \"M8 14s1.5 2 4 2 4-2 4-2\" }), h(\"line\", { x1: 9, y1: 9, x2: 9.01, y2: 9 }), h(\"line\", { x1: 15, y1: 9, x2: 15.01, y2: 9 })),\n link: () => h(\"svg\", { width: 14, height: 14, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"path\", { d: \"M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71\" }), h(\"path\", { d: \"M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71\" })),\n copy: () => h(\"svg\", { width: 14, height: 14, viewBox: \"0 0 24 24\", fill: \"none\", stroke: \"currentColor\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }, h(\"rect\", { x: 9, y: 9, width: 13, height: 13, rx: 2, ry: 2 }), h(\"path\", { d: \"M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1\" })),\n};\n",[],[165,271],["D",1776361522677],[],[165,67],"a3c18b9e-39bc-11f1-9dab-42b51c65c3df","shared.tsx","a3c18cb6-39bc-11f1-9dab-42b51c65c3df","61243de0-39bc-11f1-8518-42b51c65c3df",6,["D",1776361778910],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createElement as h, useState, useEffect, useRef } from \"react\";\nimport { REACTIONS } from \"../icons.ts\";\nimport { api } from \"../utils.ts\";\n\n// ── Kikko Wordmark ────────────────────────────────────────────────────────────\nexport function KikkoLogo({ height = 40, fill = \"currentColor\" }: { height?: number; fill?: string }) {\n const fontSize = height * 0.92;\n return h(\"span\", {\n style: {\n fontFamily: \"var(--font)\",\n fontWeight: 900,\n fontSize: fontSize + \"px\",\n color: fill === \"currentColor\" ? undefined : fill,\n letterSpacing: \"-0.02em\",\n lineHeight: 1,\n display: \"inline-block\",\n userSelect: \"none\",\n WebkitUserSelect: \"none\",\n },\n }, \"kikko\");\n}\n\n// ── ConfirmDialog ─────────────────────────────────────────────────────────────\nexport function ConfirmDialog({ title, message, danger = \"Delete\", onConfirm, onCancel }: {\n title: string;\n message: string;\n danger?: string;\n onConfirm: () => void;\n onCancel: () => void;\n}) {\n return h(\"div\", {\n className: \"confirm-overlay\",\n onPointerDown: (e: any) => { if (e.target === e.currentTarget) onCancel(); },\n },\n h(\"div\", { className: \"confirm-box\" },\n h(\"h3\", null, title),\n h(\"p\", null, message),\n h(\"div\", { className: \"confirm-actions\" },\n h(\"button\", { className: \"btn-cancel\", onClick: onCancel }, \"Cancel\"),\n h(\"button\", { className: \"btn-danger\", onClick: onConfirm }, danger)\n )\n )\n );\n}\n\n// ── Link Preview ──────────────────────────────────────────────────────────────\nconst previewCache: Record = {};\nexport function LinkPreview({ url, token }: { url: string; token?: string }) {\n const [data, setData] = useState(previewCache[url] || null);\n const [failed, setFailed] = useState(false);\n useEffect(() => {\n if (data || failed) return;\n api(\"/api/link-preview?url=\" + encodeURIComponent(url), {}, token)\n .then((r) => r.json())\n .then((d) => {\n if (d.title) { previewCache[url] = d; setData(d); }\n else setFailed(true);\n })\n .catch(() => setFailed(true));\n }, [url]);\n if (!data || failed) return null;\n return h(\"div\", { className: \"link-preview\", onClick: () => window.open(url, \"_blank\") },\n data.siteName && h(\"div\", { className: \"link-preview-site\" }, data.siteName),\n h(\"div\", { className: \"link-preview-title\" }, data.title),\n data.description && h(\"div\", { className: \"link-preview-desc\" }, data.description),\n data.image && h(\"img\", {\n className: \"link-preview-img\",\n src: data.image,\n alt: \"\",\n onError: (e: any) => (e.target.style.display = \"none\"),\n })\n );\n}\n\n// ── Reaction Picker ───────────────────────────────────────────────────────────\nexport function ReactionPicker({ onPick, onClose, style }: {\n onPick: (emoji: string) => void;\n onClose: () => void;\n style?: any;\n}) {\n const ref = useRef(null);\n useEffect(() => {\n const handler = (e: MouseEvent) => {\n if (ref.current && !ref.current.contains(e.target as Node)) onClose();\n };\n setTimeout(() => document.addEventListener(\"mousedown\", handler), 0);\n return () => document.removeEventListener(\"mousedown\", handler);\n }, []);\n return h(\"div\", { className: \"reaction-picker\", style, ref },\n REACTIONS.map((r) =>\n h(\"button\", {\n key: r.emoji,\n className: \"reaction-btn-pick\",\n title: r.label,\n onClick: () => { onPick(r.emoji); onClose(); },\n }, r.svg())\n )\n );\n}\n",[],[165,290,282],"components","b0283cde-39bc-11f1-9bc9-42b51c65c3df","auth-screen.tsx","b0283de2-39bc-11f1-9bc9-42b51c65c3df",7,["D",1776361799709],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createElement as h, useState, Fragment } from \"react\";\nimport { KikkoLogo } from \"./shared.tsx\";\nimport { api } from \"../utils.ts\";\n\nexport function AuthScreen({ onLogin }: { onLogin: (user: any) => void }) {\n const [mode, setMode] = useState<\"login\" | \"signup\" | \"recover\">(\"login\");\n const [form, setForm] = useState({ username: \"\", email: \"\", password: \"\" });\n const [error, setError] = useState(\"\");\n const [success, setSuccess] = useState(\"\");\n const [loading, setLoading] = useState(false);\n const set = (k: string, v: string) => setForm((f) => ({ ...f, [k]: v }));\n\n const submit = async () => {\n setError(\"\"); setSuccess(\"\"); setLoading(true);\n try {\n if (mode === \"recover\") {\n const r = await api(\"/api/recover\", { method: \"POST\", body: JSON.stringify({ identifier: form.email || form.username }) });\n const d = await r.json();\n if (!r.ok) setError(d.error);\n else setSuccess(\"If that account exists, your password has been sent to your email.\");\n } else if (mode === \"signup\") {\n const r = await api(\"/api/signup\", { method: \"POST\", body: JSON.stringify(form) });\n const d = await r.json();\n if (!r.ok) setError(d.error);\n else { localStorage.setItem(\"kik_token\", d.apiToken || \"\"); onLogin(d.user); }\n } else {\n const r = await api(\"/api/login\", { method: \"POST\", body: JSON.stringify({ username: form.username, password: form.password }) });\n const d = await r.json();\n if (!r.ok) setError(d.error);\n else { localStorage.setItem(\"kik_token\", d.apiToken || \"\"); onLogin(d.user); }\n }\n } catch { setError(\"Network error. Please try again.\"); }\n finally { setLoading(false); }\n };\n\n const onKey = (e: any) => e.key === \"Enter\" && submit();\n const sw = (m: \"login\" | \"signup\" | \"recover\") => { setMode(m); setError(\"\"); setSuccess(\"\"); };\n\n return h(\"div\", { className: \"auth-screen\" },\n h(\"div\", { className: \"auth-card animate-in\" },\n h(\"div\", { className: \"auth-logo\" },\n h(KikkoLogo, { height: 48, fill: \"var(--logo-fill)\" })\n ),\n error && h(\"div\", { className: \"error-msg\" }, error),\n success && h(\"div\", { className: \"success-msg\" }, success),\n mode === \"recover\"\n ? h(\"div\", { className: \"form-group\" },\n h(\"label\", null, \"Username or Email\"),\n h(\"input\", { type: \"text\", placeholder: \"Enter username or email\", value: form.email, onChange: (e: any) => set(\"email\", e.target.value), onKeyDown: onKey, autoFocus: true })\n )\n : h(\"div\", null,\n h(\"div\", { className: \"form-group\" },\n h(\"label\", null, \"Username\"),\n h(\"input\", { type: \"text\", placeholder: \"username\", value: form.username, onChange: (e: any) => set(\"username\", e.target.value), onKeyDown: onKey, autoFocus: true })\n ),\n mode === \"signup\" && h(\"div\", { className: \"form-group\" },\n h(\"label\", null, \"Email\"),\n h(\"input\", { type: \"email\", placeholder: \"you@example.com\", value: form.email, onChange: (e: any) => set(\"email\", e.target.value), onKeyDown: onKey })\n ),\n h(\"div\", { className: \"form-group\" },\n h(\"label\", null, \"Password\"),\n h(\"input\", { type: \"password\", placeholder: \"••••••••\", value: form.password, onChange: (e: any) => set(\"password\", e.target.value), onKeyDown: onKey })\n )\n ),\n h(\"button\", { className: \"btn btn-primary\", onClick: submit, disabled: loading },\n loading\n ? h(Fragment, null, h(\"span\", { className: \"btn-spinner\" }), mode === \"login\" ? \"Signing in…\" : mode === \"signup\" ? \"Creating account…\" : \"Sending…\")\n : mode === \"login\" ? \"Sign In\" : mode === \"signup\" ? \"Create Account\" : \"Send Password to Email\"\n ),\n h(\"div\", { className: \"auth-toggle\" },\n mode === \"login\" && h(\"span\", null,\n h(\"button\", { onClick: () => sw(\"signup\") }, \"Create account\"), \" · \",\n h(\"button\", { onClick: () => sw(\"recover\") }, \"Forgot password?\")\n ),\n mode === \"signup\" && h(\"button\", { onClick: () => sw(\"login\") }, \"Already have an account? Sign in\"),\n mode === \"recover\" && h(\"button\", { onClick: () => sw(\"login\") }, \"Back to sign in\")\n )\n )\n );\n}\n",[],[165,290,292],"61243d4a-39bc-11f1-8518-42b51c65c3df",["D",1776361667150],[181,182],[165,290],"0b271d7c-39bc-11f1-b179-42b51c65c3df",["D",1776361522677],[180,183,184,185,186,187,188],[165],"0b25a424-39bc-11f1-b179-42b51c65c3df","queries.ts","019d9765-c687-762d-97e2-626c9e8fbb4d","019d9765-c687-762d-97e2-642822b8f1e2",["D",1776361522677],"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 300 messages per room (keeps newest, deletes oldest)\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 300)`,\n args: [roomId, roomId],\n });\n return r.lastInsertRowid;\n}\n\nexport async function editMessage(messageId: number, userId: number, content: string) {\n // Save original_content on first edit only (if not already saved)\n await sqlite.execute({\n sql: `UPDATE messages SET\n original_content = CASE WHEN original_content IS NULL THEN messages.content ELSE original_content END,\n content = ?,\n edited_at = datetime('now')\n 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.*,\n CASE WHEN m.is_deleted = 1 THEN m.deleted_username ELSE u.username END AS username,\n CASE WHEN m.is_deleted = 1 THEN NULL ELSE u.avatar_blob_key END AS avatar_blob_key\n FROM messages m\n LEFT JOIN users u ON m.user_id = u.id\n 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.*,\n CASE WHEN m.is_deleted = 1 THEN m.deleted_username ELSE u.username END AS username,\n CASE WHEN m.is_deleted = 1 THEN NULL ELSE u.avatar_blob_key END AS avatar_blob_key\n FROM messages m\n LEFT JOIN users u ON m.user_id = u.id\n 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.*,\n CASE WHEN m.is_deleted = 1 THEN m.deleted_username ELSE u.username END AS username,\n CASE WHEN m.is_deleted = 1 THEN NULL ELSE u.avatar_blob_key END AS avatar_blob_key\n FROM messages m\n LEFT JOIN users u ON m.user_id = u.id\n WHERE m.room_id = ? ORDER BY m.id ASC LIMIT 300`,\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.*,\n CASE WHEN m.is_deleted = 1 THEN m.deleted_username ELSE u.username END AS username,\n CASE WHEN m.is_deleted = 1 THEN NULL ELSE u.avatar_blob_key END AS avatar_blob_key\n FROM messages m\n LEFT JOIN users u ON m.user_id = u.id\n WHERE m.room_id = ? AND m.content LIKE ? AND m.is_deleted = 0\n ORDER BY m.id DESC LIMIT 50`,\n args: [roomId, `%${query}%`],\n });\n return r.rows;\n}\n\n// Clear all messages in a room (admin only)\nexport async function clearRoom(roomId: number) {\n await sqlite.execute({\n sql: `DELETE FROM messages WHERE room_id = ?`,\n args: [roomId],\n });\n // Also wipe reactions for those messages (already gone, but clean up reactions table)\n await sqlite.execute({\n sql: `DELETE FROM reactions WHERE message_id NOT IN (SELECT id FROM messages)`,\n args: [],\n });\n}\n\n// Soft-delete a single message (admin moderation or owner)\nexport async function deleteMessage(messageId: number) {\n // Snapshot the username before soft-deleting (in case user still exists)\n const r = await sqlite.execute({\n sql: `SELECT m.*, u.username AS live_username FROM messages m LEFT JOIN users u ON m.user_id = u.id WHERE m.id = ?`,\n args: [messageId],\n });\n const msg = r.rows[0] as any;\n if (!msg) return;\n const username = msg.deleted_username ?? msg.live_username ?? \"unknown\";\n await sqlite.execute({\n sql: `UPDATE messages SET is_deleted = 1, deleted_username = ? WHERE id = ?`,\n args: [username, messageId],\n });\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\n// ---- ntfy push notifications ----\nexport async function setNtfyTopic(userId: number, topic: string) {\n await sqlite.execute({ sql: `UPDATE users SET ntfy_topic = ? WHERE id = ?`, args: [topic, userId] });\n}\n\nexport async function clearNtfyTopic(userId: number) {\n await sqlite.execute({ sql: `UPDATE users SET ntfy_topic = NULL WHERE id = ?`, args: [userId] });\n}\n\nexport async function getNtfyTopic(userId: number): Promise {\n const r = await sqlite.execute({ sql: `SELECT ntfy_topic FROM users WHERE id = ?`, args: [userId] });\n return (r.rows[0]?.ntfy_topic as string | null) ?? null;\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\nexport async function deleteUser(userId: number) {\n // Remove all user data in order (FK-safe)\n await sqlite.execute({ sql: `DELETE FROM reactions WHERE user_id = ?`, args: [userId] });\n await sqlite.execute({ sql: `DELETE FROM blocked_users WHERE user_id = ? OR blocked_user_id = ?`, args: [userId, userId] });\n await sqlite.execute({ sql: `DELETE FROM room_members WHERE user_id = ?`, args: [userId] });\n await sqlite.execute({ sql: `DELETE FROM room_invites WHERE invited_user_id = ? OR invited_by = ?`, args: [userId, userId] });\n await sqlite.execute({ sql: `DELETE FROM typing WHERE user_id = ?`, args: [userId] });\n await sqlite.execute({ sql: `DELETE FROM mention_queue WHERE mentioned_user_id = ?`, args: [userId] });\n await sqlite.execute({ sql: `DELETE FROM sessions WHERE user_id = ?`, args: [userId] });\n await sqlite.execute({ sql: `DELETE FROM api_tokens WHERE user_id = ?`, args: [userId] });\n // Clear ntfy topic so no stale push URL remains\n await sqlite.execute({ sql: `UPDATE users SET ntfy_topic = NULL WHERE id = ?`, args: [userId] });\n // Soft-delete messages: snapshot the username, mark is_deleted=1, then NULL out\n // user_id so the FK constraint doesn't block deleting the user row.\n const userRecord = await getUserById(userId);\n const oldUsername = userRecord ? String(userRecord.username) : \"deleted\";\n await sqlite.execute({\n sql: `UPDATE messages SET is_deleted = 1, deleted_username = ?, user_id = NULL WHERE user_id = ?`,\n args: [oldUsername, userId],\n });\n // Also NULL out reactions FK before deleting (reactions were already hard-deleted above,\n // but reply_to messages may still reference this user indirectly — nulling user_id covers it)\n await sqlite.execute({ sql: `DELETE FROM users WHERE id = ?`, args: [userId] });\n}\n",[],[315,308],"database","0b257cc4-39bc-11f1-b179-42b51c65c3df","migrations.ts","019d9765-c687-762d-97e2-5eee2404be0d",["D",1776361522677],"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 try { await sqlite.execute(`ALTER TABLE users ADD COLUMN ntfy_topic 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 // Soft-delete support: when a user is deleted their messages stay but show as [deleted]\n try { await sqlite.execute(`ALTER TABLE messages ADD COLUMN is_deleted INTEGER DEFAULT 0`); } catch {}\n try { await sqlite.execute(`ALTER TABLE messages ADD COLUMN deleted_username TEXT`); } catch {}\n // Store original content before first edit\n try { await sqlite.execute(`ALTER TABLE messages ADD COLUMN original_content TEXT`); } catch {}\n\n // Allow user_id to be NULL on messages so we can soft-delete messages when a user is deleted\n // without violating the FK constraint. SQLite can't ALTER COLUMN, so we recreate the table.\n // We only do this if the column is still NOT NULL (check by trying to set a NULL — if it throws, migrate).\n try {\n // Check if user_id already allows NULL by looking at table info\n const info = await sqlite.execute(`PRAGMA table_info(messages)`);\n const userIdCol = (info.rows as any[]).find((r: any) => r.name === \"user_id\");\n if (userIdCol && userIdCol.notnull === 1) {\n // Need to recreate the table without the NOT NULL constraint and without the FK on user_id\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS messages_new (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n room_id INTEGER NOT NULL,\n user_id INTEGER,\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 is_deleted INTEGER DEFAULT 0,\n deleted_username TEXT,\n created_at TEXT DEFAULT (datetime('now')),\n FOREIGN KEY (room_id) REFERENCES rooms(id)\n )\n `);\n await sqlite.execute(`INSERT INTO messages_new SELECT id, room_id, user_id, content, blob_key, blob_name, blob_size, reply_to_id, edited_at, is_deleted, deleted_username, created_at FROM messages`);\n await sqlite.execute(`DROP TABLE messages`);\n await sqlite.execute(`ALTER TABLE messages_new RENAME TO messages`);\n }\n } catch (e) {\n console.error(\"Migration: messages nullable user_id failed:\", e);\n }\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",[],[315,317],"0b25ecd6-39bc-11f1-b179-42b51c65c3df",["D",1776361522677],[177,178],[315],["D",1776361522677],["D",1789509672838],{"_11":12,"_124":72},{"_11":12,"_120":-5,"_71":72,"_30":70,"_121":122,"_123":24},{"_38":109,"_13":16,"_32":35,"_110":74,"_111":62,"_112":63,"_113":78,"_114":115,"_116":117,"_118":14,"_119":12},"ctx",{"_51":-5,"_146":365,"_366":367,"_368":369,"_370":24,"_371":24,"_372":24,"_373":144,"_374":-5,"_375":-7,"_376":-7,"_377":26,"_378":24,"_379":24,"_380":-5,"_381":24,"_382":24,"_383":24,"_384":-5},"ENV",{"_336":337,"_338":339,"_340":16,"_341":342,"_343":344,"_345":346,"_347":348,"_349":350,"_351":352,"_353":354,"_355":356,"_357":358,"_359":360,"_361":362,"_363":364},"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