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",[],[207,213],{"_107":221,"_100":222,"_172":223,"_174":208,"_175":153,"_176":177,"_178":122,"_109":224,"_104":33,"_180":216,"_182":225,"_183":22,"_184":-5,"_185":226,"_103":227},"0129079e-36e3-11f1-9dd2-42b51c65c3df","index.html","019d84bb-f221-752a-9fe3-9d55faca7ab1",["D",1776048402859],"\n\n\n \n \n Kikko\n \n\n\n\n

\n\n\n\n\n\n",[],[207,222],{"_107":229,"_100":230,"_172":231,"_174":208,"_175":153,"_176":177,"_178":122,"_109":232,"_104":33,"_180":216,"_182":233,"_183":22,"_184":-5,"_185":234,"_103":235},"012ad2c2-36e3-11f1-9dd2-42b51c65c3df","style.css","019d84bb-f221-752a-9fe3-a0ca660cd2e8",["D",1776048402859],"*, *::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: '▎';\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",[],[207,230],[207],{"_107":238,"_100":239,"_172":240,"_174":-5,"_175":153,"_176":177,"_178":122,"_109":241,"_104":33,"_180":181,"_182":-5,"_183":22,"_184":-5,"_185":242,"_103":267},"012bddc0-36e3-11f1-9dd2-42b51c65c3df","shared","019d84bb-f221-752a-9fe3-b48d529577e5",["D",1776048402859],[243,251,259],{"_107":244,"_100":245,"_172":246,"_174":240,"_175":153,"_176":177,"_178":122,"_109":247,"_104":33,"_180":192,"_182":248,"_183":22,"_184":-5,"_185":249,"_103":250},"012bc236-36e3-11f1-9dd2-42b51c65c3df","auth.ts","019d84bb-f221-752a-9fe3-ab0902972b51",["D",1776048402859],"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",[],[239,245],{"_107":252,"_100":253,"_172":254,"_174":240,"_175":153,"_176":177,"_178":122,"_109":255,"_104":33,"_180":192,"_182":256,"_183":22,"_184":-5,"_185":257,"_103":258},"012bc70e-36e3-11f1-9dd2-42b51c65c3df","email.ts","019d84bb-f221-752a-9fe3-ae1fac03af6f",["D",1776048402859],"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",[],[239,253],{"_107":260,"_100":261,"_172":262,"_174":240,"_175":153,"_176":177,"_178":122,"_109":263,"_104":33,"_180":192,"_182":264,"_183":22,"_184":-5,"_185":265,"_103":266},"012bd898-36e3-11f1-9dd2-42b51c65c3df","types.ts","019d84bb-f221-752a-9fe3-b27c9b2bf9b2",["D",1776048402859],"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",[],[239,261],[239],{"_107":269,"_100":270,"_172":271,"_174":-5,"_175":153,"_176":152,"_178":122,"_109":272,"_104":273,"_180":192,"_182":274,"_183":22,"_184":-5,"_185":275,"_103":276},"47069096-36e4-11f1-8572-42b51c65c3df","capture-intro-worker.ts","b28fc90a-36e3-11f1-a75e-42b51c65c3df",["D",1776048949715],11,"/**\n * capture-intro-worker.ts\n * Captures the Kikko intro animation by taking rapid screenshots via\n * Browserless (free tier) and saves them as a ZIP of PNG frames to blob.\n *\n * Resolution: 1600×1200 | 10fps | 4 seconds = 40 frames\n *\n * To convert frames to MP4 after downloading the zip:\n * unzip kikko-frames.zip\n * ffmpeg -framerate 10 -i frame%04d.png -c:v libx264 -pix_fmt yuv420p intro.mp4\n *\n * Or upload the zip to https://cloudconvert.com (supports image sequence → mp4)\n *\n * After running: GET /capture-intro/download to fetch the zip file.\n */\nimport { blob } from \"https://esm.town/v/std/blob\";\nimport puppeteer from \"npm:puppeteer-core@22\";\nimport JSZip from \"npm:jszip@3.10.1\";\n\nconst BLOB_KEY = \"kikko-intro-frames.zip\";\nconst TARGET_URL =\n \"https://ricardogibson--019d84af25be746f997604e3d4d26736.web.val.run/\";\nconst FPS = 10;\nconst DURATION_S = 4;\nconst FRAME_COUNT = FPS * DURATION_S;\n\nconst token = Deno.env.get(\"BROWSERLESS_TOKEN\");\nif (!token) throw new Error(\"Missing BROWSERLESS_TOKEN env var.\");\n\nconst sleep = (ms: number) => new Promise((r) => setTimeout(r, ms));\n\n// ── 1. Capture frames via Browserless ─────────────────────────────────────────\nconsole.log(\"Connecting to Browserless...\");\nconst browser = await puppeteer.connect({\n browserWSEndpoint:\n `wss://production-sfo.browserless.io?token=${token}&headless=true&stealth`,\n});\n\nconst frames: Uint8Array[] = [];\ntry {\n const page = await browser.newPage();\n await page.setViewport({ width: 1600, height: 1200, deviceScaleFactor: 1 });\n\n console.log(\"Navigating to Kikko...\");\n await page.goto(TARGET_URL, {\n waitUntil: \"domcontentloaded\",\n timeout: 20000,\n });\n\n console.log(`Capturing ${FRAME_COUNT} frames at ${FPS}fps...`);\n const interval = 1000 / FPS;\n\n for (let i = 0; i < FRAME_COUNT; i++) {\n const t0 = Date.now();\n const png = await page.screenshot({\n type: \"png\",\n encoding: \"binary\",\n }) as Buffer;\n frames.push(new Uint8Array(png));\n const wait = Math.max(0, interval - (Date.now() - t0));\n if (wait > 0) await sleep(wait);\n if (i % 10 === 0) console.log(` frame ${i + 1}/${FRAME_COUNT}`);\n }\n console.log(`✅ Captured ${frames.length} frames.`);\n} finally {\n await browser.close();\n}\n\n// ── 2. Zip all frames ─────────────────────────────────────────────────────────\nconsole.log(\"Zipping frames...\");\nconst zip = new JSZip();\nfor (let i = 0; i < frames.length; i++) {\n zip.file(`frame${String(i).padStart(4, \"0\")}.png`, frames[i]);\n}\n\n// Add a README with ffmpeg command\nzip.file(\n \"README.txt\",\n `Kikko intro frames — ${frames.length} PNGs at ${FPS}fps, 1600x1200\\n\\n` +\n `Convert to MP4:\\n` +\n ` ffmpeg -framerate ${FPS} -i frame%04d.png -c:v libx264 -pix_fmt yuv420p intro.mp4\\n\\n` +\n `Or use https://cloudconvert.com (Image Sequence → MP4)\\n`,\n);\n\nconst zipBuf = await zip.generateAsync({ type: \"uint8array\" });\nawait blob.set(BLOB_KEY, zipBuf.buffer);\n\nconsole.log(\n `✅ ZIP saved! ${(zipBuf.byteLength / 1024 / 1024).toFixed(2)} MB — now GET /capture-intro/download`,\n);\n",[],[270],{"_107":278,"_100":279,"_172":120,"_174":-5,"_175":153,"_176":280,"_178":122,"_109":281,"_104":282,"_180":283,"_182":284,"_183":22,"_184":-5,"_185":285,"_103":286},"3b01bb54-36e4-11f1-8fb7-42b51c65c3df","capture-intro.ts",18,["D",1776048929548],6,"http","/**\n * capture-intro.ts — records the Kikko loading intro at 1600×1200\n *\n * HOW TO USE:\n * Step 1: POST /capture-intro/start → kicks off a background recording\n * Step 2: Wait ~8 seconds\n * Step 3: GET /capture-intro/download → downloads kikko-intro.webm\n *\n * Convert to mp4 (free): https://cloudconvert.com/webm-to-mp4\n *\n * Requires env var: BROWSERLESS_TOKEN (from https://www.browserless.io/)\n */\n\nimport { blob } from \"https://esm.town/v/std/blob\";\n\nconst BLOB_KEY = \"kikko-intro-frames.zip\";\nconst TARGET_URL =\n \"https://ricardogibson--019d84af25be746f997604e3d4d26736.web.val.run/\";\n\nexport default async function handler(req: Request): Promise {\n const url = new URL(req.url);\n\n // ── GET /capture-intro/download ─────────────────────────────────────────────\n if (req.method === \"GET\" && url.pathname.endsWith(\"/download\")) {\n try {\n const resp = await blob.get(BLOB_KEY);\n const buf = await resp.arrayBuffer();\n return new Response(buf, {\n headers: {\n \"Content-Type\": \"application/zip\",\n \"Content-Disposition\": 'attachment; filename=\"kikko-intro-frames.zip\"',\n \"Content-Length\": String(buf.byteLength),\n \"Cache-Control\": \"no-store\",\n },\n });\n } catch {\n return Response.json(\n {\n error: \"No recording found yet.\",\n hint:\n \"First POST to /capture-intro/start, wait ~8 seconds, then GET /capture-intro/download\",\n },\n { status: 404 },\n );\n }\n }\n\n // ── POST /capture-intro/start ────────────────────────────────────────────────\n if (req.method === \"POST\" && url.pathname.endsWith(\"/start\")) {\n const token = Deno.env.get(\"BROWSERLESS_TOKEN\");\n if (!token) {\n return Response.json(\n {\n error: \"Missing BROWSERLESS_TOKEN env var.\",\n hint:\n \"Go to val Settings → Environment Variables and add BROWSERLESS_TOKEN\",\n },\n { status: 500 },\n );\n }\n\n // Fire the Browserless screencast request in the background so we can\n // return immediately (avoiding Val Town's response timeout).\n // The recording saves to blob; then hit /download to retrieve it.\n (async () => {\n try {\n const scriptCode = `module.exports = async ({ page }) => {\n const sleep = (ms) => new Promise((res) => setTimeout(res, ms));\n await page.setViewport({ width: 1600, height: 1200, deviceScaleFactor: 1 });\n await page.goto(${JSON.stringify(TARGET_URL)}, { waitUntil: \"networkidle0\", timeout: 15000 });\n await sleep(5000);\n};`;\n\n const res = await fetch(\n `https://chrome.browserless.io/screencast?token=${token}&--window-size=1600,1200`,\n {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/javascript\" },\n body: scriptCode,\n },\n );\n\n if (!res.ok) {\n console.error(\n `Browserless error: ${res.status} ${res.statusText}`,\n await res.text(),\n );\n return;\n }\n\n const buf = await res.arrayBuffer();\n await blob.set(BLOB_KEY, buf);\n console.log(\n `Recording saved to blob: ${BLOB_KEY} (${buf.byteLength} bytes)`,\n );\n } catch (e) {\n console.error(\"Background recording failed:\", e);\n }\n })();\n\n return Response.json({\n ok: true,\n message:\n \"Recording started in background. Wait ~8 seconds, then GET /capture-intro/download to retrieve your webm file.\",\n downloadUrl: url.origin + url.pathname.replace(\"/start\", \"/download\"),\n });\n }\n\n // ── Default: instructions page ───────────────────────────────────────────────\n return new Response(\n `\n\n\n \n Kikko Intro Capture\n \n\n\n

🎥 Kikko Intro Capture

Records the loading screen animation at 1600×1200 as a WebM file.

\n \n

\n \n\n`,\n { headers: { \"Content-Type\": \"text/html\" } },\n );\n}\n",[],[279],{"_107":288,"_100":289,"_172":290,"_174":-5,"_175":153,"_176":177,"_178":122,"_109":291,"_104":33,"_180":292,"_182":293,"_183":22,"_184":-5,"_185":294,"_103":295},"012bf364-36e3-11f1-9dd2-42b51c65c3df","cron-cleanup.ts","019d84bb-f221-752a-9fe3-bd0f0b6adcfc",["D",1776048402859],"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}",[],[289],{"_107":297,"_100":298,"_172":299,"_174":-5,"_175":153,"_176":177,"_178":122,"_109":300,"_104":33,"_180":283,"_182":301,"_183":22,"_184":-5,"_185":302,"_103":303},"012bff94-36e3-11f1-9dd2-42b51c65c3df","index.ts","019d84bb-f221-752a-9fe3-c287df31624d",["D",1776048402859],"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\n// Delete (opt-out) the user's ntfy topic\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\n// Test ntfy push notification for current user\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 // Admin sees only rooms they are actually a member of (or world chat), just like regular users\n const rooms = await getRoomsForUser(Number(user.id));\n return c.json({ rooms });\n});\n\n// Admin-only: get ALL rooms (for admin panel rooms tab)\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 admin is viewing a room they weren't actually invited to, exclude themselves from member list\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 // Check if the target has blocked the inviter — blocked users cannot invite you to private groups\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 // Poll with 2s sleep between checks to reduce DB pressure.\n // Max 10 iterations × 2s = 20s max hold time.\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 // ── Push notifications — run BEFORE returning response so they complete ──\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 // Wait for all notifications, but cap at 5s so the client isn't stuck forever\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\n// Shared SSE stream helper\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\n// ─── TRIAGE endpoint ──────────────────────────────────────────────────────────\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\n// ─── Admin execute ────────────────────────────────────────────────────────────\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\n// ─── Admin chat ───────────────────────────────────────────────────────────────\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 // Direct command execution\n const directResult = await execAdminCommand(lastMsg);\n if (directResult !== null) return makeSSEStream(directResult, CORS_HEADERS);\n\n // \"yes\" / \"confirm\" → execute last suggested Action\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. This includes: \"who is this user\", \"tell me about X\", \"what's happening in room Y\", \"how many users\", \"who joined recently\", \"look up X\", general chat, etc.\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 — that phrase is only for triage scans that find nothing.\n\n━━━ MODE 2: MODERATION FLAGS ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━\nWhen asked to scan/triage, ONLY flag genuine serious issues:\n- CRITICAL: credible death threats at a specific real person, doxxing (address/phone/SSN), malware/phishing links, CSAM, calls for real-world violence\n- VIOLATION: sustained targeted harassment across multiple messages, slurs weaponized against a specific person, coordinated spam or brigading\n\nCompletely ignore: swearing, profanity, insults, venting, dark humor, sarcasm, trash talk, one-off slurs not aimed at anyone, criticizing the app.\n\n━━━ BAN EVASION DETECTION ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━\nWhen scanning OR when admin asks to check for ban evasion, compare all usernames and emails across the user list. Flag potential evaders using:\n- Very similar usernames: same base + added/changed numbers, letters, symbols (alex → alex2, alex_, al3x, alexx, xalex)\n- Leetspeak: a↔4, e↔3, i↔1, o↔0, s↔5\n- Prefix/suffix additions, reversed names, inserted dots/underscores\n- Same or very similar email addresses (same local part, similar local part, or same base on different free-mail domains)\n- Accounts created shortly after a ban with a similar username or email\n\nFormat as:\n--- BAN EVASION SUSPECT ---\n@newuser may be @banneduser | reason (username similarity / email similarity / timing)\nAction: ban @newuser\n\n━━━ UNIVERSAL RULES ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━\n1. Never hallucinate. Only state what is in the live data. If something isn't in the data, say so.\n2. Never say \"All clear\" except after a moderation scan that genuinely found nothing to flag.\n3. No emojis.\n4. Skip @${ADMIN_USERNAME} in all checks.\n5. Skip [BANNED] users in violation flags but still check them for ban evasion (to catch their alt accounts).\n6. Format moderation flags as:\n --- CRITICAL ---\n @username | \"quote\" | reason\n Action: ban @username\n\n --- VIOLATION ---\n @username | \"quote\" | reason\n Action: mute @username 60\n\n7. Always include Action: lines when recommending action so admin can execute with \"yes\".\n8. Supported commands: ban @user [hours] | unban @user | mute @user [mins] | unmute @user | delete msg | clear room \n9. Be direct and concise. Don't pad. Don't repeat yourself. 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\n// ─── AI Chat (Mistral / Codestral) ───────────────────────────────────────────\napp.post(\"/api/ai/chat\", async (c) => {\n const user = await getSessionUser(c);\n if (!user) return c.json({ error: \"Not authenticated\" }, 401);\n const { messages, model } = await c.req.json();\n if (!messages?.length) return c.json({ error: \"Messages required\" }, 400);\n\n const isCodestral = model === \"codestral-latest\";\n const apiKey = isCodestral ? CODESTRAL_API_KEY : MISTRAL_API_KEY;\n const apiUrl = isCodestral\n ? \"https://codestral.mistral.ai/v1/chat/completions\"\n : \"https://api.mistral.ai/v1/chat/completions\";\n const selectedModel = isCodestral\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;",[],[298],"files",[169,187,196,205,211,220,228,237,243,251,259,268,277,287,296],"counts",{"_308":33,"_309":177,"_310":177,"_311":312,"_315":316},"pulls","branches","forks","envVars",{"_313":177,"_314":33},"count","emptyCount","connections",{"_313":33,"_317":33},"unfilledCount","contents",[320,323,326,329,332,335,338],{"_107":170,"_100":171,"_172":173,"_174":-5,"_175":153,"_176":177,"_178":122,"_109":321,"_104":33,"_180":181,"_182":-5,"_183":22,"_184":-5,"_103":322},["D",1776048402859],[171],{"_107":206,"_100":207,"_172":208,"_174":-5,"_175":153,"_176":177,"_178":122,"_109":324,"_104":33,"_180":181,"_182":-5,"_183":22,"_184":-5,"_103":325},["D",1776048402859],[207],{"_107":238,"_100":239,"_172":240,"_174":-5,"_175":153,"_176":177,"_178":122,"_109":327,"_104":33,"_180":181,"_182":-5,"_183":22,"_184":-5,"_103":328},["D",1776048402859],[239],{"_107":269,"_100":270,"_172":271,"_174":-5,"_175":153,"_176":152,"_178":122,"_109":330,"_104":273,"_180":192,"_182":274,"_183":22,"_184":-5,"_103":331},["D",1776048949715],[270],{"_107":278,"_100":279,"_172":120,"_174":-5,"_175":153,"_176":280,"_178":122,"_109":333,"_104":282,"_180":283,"_182":284,"_183":22,"_184":-5,"_103":334},["D",1776048929548],[279],{"_107":288,"_100":289,"_172":290,"_174":-5,"_175":153,"_176":177,"_178":122,"_109":336,"_104":33,"_180":292,"_182":293,"_183":22,"_184":-5,"_103":337},["D",1776048402859],[289],{"_107":297,"_100":298,"_172":299,"_174":-5,"_175":153,"_176":177,"_178":122,"_109":339,"_104":33,"_180":283,"_182":301,"_183":22,"_184":-5,"_103":340},["D",1776048402859],[298],"upstreamProject",{"_107":161,"_100":101,"_115":116,"_117":-5,"_113":114,"_23":343},{"_98":344,"_144":77},"ricardogibson","upstreamBranch",{"_107":156,"_109":347,"_348":349,"_100":46,"_154":161,"_104":158,"_155":350,"_157":351,"_352":353,"_111":-5,"_166":22,"_113":114,"_165":344,"_16":163,"_164":101},["D",1776047564100],"updatedAt",["D",1776048289244],"8092b556-36df-11f1-ae59-42b51c65c3df",4,"lockfileKey","1776048289918-esm.town_v_ricardogibson_Huddle@5-main","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.environment-variables",{"_98":99,"_100":101,"_105":360,"_311":366,"_373":22},{"_107":108,"_100":101,"_109":361,"_111":-5,"_112":22,"_113":114,"_115":116,"_117":-5,"_14":118,"_119":120,"_121":122,"_123":-5,"_124":-5,"_125":33,"_16":126,"_127":128,"_129":130,"_131":362,"_133":-5,"_134":135,"_136":135,"_137":138,"_139":138,"_140":138,"_141":135,"_142":135,"_23":363,"_145":364,"_150":365,"_166":22},["D",1776048402859],["D",1776048633238],{"_98":99,"_144":77},{"_98":99,"_147":77,"_14":118,"_148":149},{"_104":152,"_100":46,"_107":153,"_154":108,"_155":156,"_157":158,"_159":114,"_160":161,"_162":163,"_164":101,"_165":99},[367],{"_368":369,"_109":370,"_348":-5,"_115":371,"_372":22},"key","BROWSERLESS_TOKEN",["D",1776048545514],"Browserless API token for capturing the Kikko intro animation as a WebM video","isEmpty","isTeamOrg","actionData","errors"]

lynnesatterfield

Huddle

Environment variables