cinny/LOTUS_BUGS.md

Lotus Chat — Bug Report & Technical Audit

Date: June 2026

This document tracks identified bugs, edge cases, and architectural discrepancies found during the audit of the Lotus Chat codebase. Recommended fixes are provided for each item.

---

🚩 Critical & UI Bugs

12. PiP Mute Icon Misidentifies Whose Mic Is Muted

• File: cinny/src/app/components/CallEmbedProvider.tsx
• Status: FIXED ⚠️ UNTESTED — needs verification in a live call with at least one other participant who mutes/unmutes
• Issue: The muted-mic badge in the Picture-in-Picture window used useRemoteAllMuted (fires when ANY remote participant is muted) and rendered in the bottom-left corner — the conventional position for "YOUR" mic status. Users read it as their own mic being muted.
• Root Cause: PipMuteOverlay was triggering on remote-mute events while displaying in a position that implies local-user status.
• Fix Applied:
  • Bottom-left badge now shows only when the LOCAL user's mic is muted (checked via !controlState.microphone from useCallControlState). Includes "You" label to make it unambiguous. Uses color.Critical.Main.
  • Top-right badge (new) shows "All muted" in color.Warning.Main when all remote participants are muted — positioned and labeled so it's clearly about other people, not the local user.
  • Both badges use aria-label / title for accessibility.

---

1. No Camera Focus During Screenshare

• File: cinny/src/app/plugins/call/CallControl.ts, cinny/src/app/features/call-status/MemberGlance.tsx
• Status: FIXED ⚠️ UNTESTED — needs verification in a live call with an active screenshare + a participant on camera
• Issue: Automatic screenshare spotlighting forces primary display override, preventing users from manually focusing on camera feeds.
• Root Cause: Before this feature there was no UI path to manually pick a camera to focus, so EC's auto-spotlight (which prioritizes an active screenshare) always won.
• Fix Applied: CallControl.focusCameraParticipant(userId) switches EC to spotlight mode and clicks that participant's [data-testid="videoTile"] inside the EC iframe — in Element Call, clicking a tile in spotlight pins it, so the user's explicit selection takes precedence over the auto-pinned screenshare. Exposed via a "Focus camera" item in the MemberGlance participant menu (avatar → menu). Falls back to a plain spotlight toggle if the tile isn't rendered (e.g. camera off).
• Architectural note: EC owns the grid/spotlight renderer inside its iframe; our control is DOM-level tile clicks. The pin persists until changed, so a one-shot focus is sufficient. A continuously-enforced "sticky" focus that re-pins on every EC spotlight change was deliberately not built — it would require fighting EC's internal state on each mutation and risks flicker.

2. Chat Background Animation Flickering

• File: cinny/src/app/features/lotus/chatBackground.ts
• Status: FIXED ⚠️ UNTESTED — needs verification on a real device with an animated background active
• Issue: Animated background properties cause visible flickering on message text and the composer area, particularly on browsers/GPUs susceptible to repaint-induced artifacts.
• Root Cause: Animation triggers excessive repaints or layout recalculations on descendant elements, likely due to animating non-GPU accelerated properties on parent containers without proper rendering context isolation.
• Fix Applied: getChatBg() now injects willChange: 'background-position' and contain: 'paint' for any animated variant. This promotes the element to its own compositor layer and isolates repaints from descendants. Background-position animation is already GPU-hinted on modern browsers; contain: paint prevents descendant elements from being invalidated during each frame.

3. Avatar Decorations in Element Call

• File: cinny/src/app/features/call/CallMemberCard.tsx
• Status: FIXED ⚠️ UNTESTED — needs verification in a live call with a participant who has a decoration set
• Issue: Avatar decorations are failing to render within the call/room interface member lists.
• Root Cause: Member lists and the people drawer already wrapped avatars in <AvatarDecoration userId={...}>, but the call participant tile (CallMemberCard) rendered a bare <UserAvatar> with no decoration wrapper — so decorations were absent specifically on call tiles. (Note: avatars rendered inside the Element Call iframe are EC-rendered and out of our control; this fix covers our own participant roster / prescreen.)
• Fix Applied: Wrapped the call-tile avatar in <AvatarDecoration userId={userId}> (commit 0394fce9), matching the member-list pattern.

4. DM and Group Message Calls

• File: cinny/src/app/components/CallEmbedProvider.tsx
• Status: FIXED ⚠️ UNTESTED — needs live-call verification: (a) ring/preview per selected ringtone & volume; (b) the corner banner appearing (with a single ping, not a loop) when a second call arrives while already in a call.
• Issue: Incoming call ringtone is hardcoded, lacks volume control, and is suppressed if the user is already in an active call.
• Root Cause: Ringing logic is tightly coupled to RTCNotification events in CallEmbedProvider.tsx, using a hardcoded audio file path. It lacks an abstraction for sound management or user-configurable settings for ringtones/volumes.
• Fix Applied:
  • ringtoneVolume setting (0–100, default 70); applied to the ring. Slider in Settings → General → Calls.
  • (a) Ringtone selection (4a875884): ringtoneId setting (classic | chime | soft | retro | none). New utils/ringtones.ts synthesizes the three styles in-browser (WebAudio, mirroring callSounds.ts) — no new binary assets; classic keeps call.ogg; none is silent/visual-only. startRingtone() loops until stopped; previewRingtone() powers the on-select preview in Settings. Persisted id is whitelisted in getSettings.
  • (b) Active-call notification (c67aed01): when already joined to a different call, a compact, non-intrusive IncomingCallBanner (caller avatar + name + Answer/Reject, top-right) replaces the full-screen IncomingCall overlay and plays a single soft ping (one-shot ringtone) instead of the looping ring — so it never takes over the screen or talks over the active call. Full overlay still shows when in no call; being in the ringing room's own call still shows nothing.

5. Seasonal Themes and Chat Backgrounds Design

• File: cinny/src/app/hooks/useTheme.ts, cinny/src/app/features/lotus/chatBackground.ts
• Status: OPEN
• Issue: Basic CSS or random moving lines are insufficient for high-fidelity wallpaper/theming. They lack professional design theory, coherence, and aesthetic depth.
• Root Cause: Current implementation relies on basic CSS, lacks advanced design theory, and does not leverage modern, performant CSS wallpaper techniques.
• Proposed Fix (Extreme Depth Redesign):
  • Research-Backed Implementation: Implement advanced design techniques (layered oklch gradients, backdrop-filter for refractive "liquid glass" effects, GPU-accelerated transform animations) to create living, breathing backgrounds.
  • Performance Optimization: Ensure all animations strictly use compositor-thread properties (transform, opacity) and apply contain: paint / will-change: transform to prevent layout thrashing/flickering.
  • Design Resources (Examples/Inspiration):
    • Uiverse.io Patterns
    • MagicPattern CSS Backgrounds
    • Prismic Blog: CSS Background Effects
    • CSS-Pattern.com (Pure CSS pattern library)
    • BGJar (Performance-focused generators)
  • Goal: Treat each theme/background as a week-long development sprint to ensure professional polish, WCAG AA contrast compliance for overlaying UI, and seamless integration with the Lotus TDS.

6. Exclusive Background vs. Seasonal Choice

• File: cinny/src/app/state/settings.ts
• Status: FIXED ⚠️ UNTESTED — needs verification: (a) pick a background, confirm seasonal theme auto-clears; (b) pick a seasonal theme, confirm background auto-clears; (c) set both via old localStorage data and reload, confirm SeasonalEffect guard suppresses the overlay
• Issue: Concurrent application of both Chat Backgrounds and Seasonal Themes causes visual clutter and high GPU usage.
• Root Cause: These are currently handled as independent settings in the settingsAtom and applied simultaneously without mutual exclusion.
• Fix Applied: Mutual exclusion enforced at two layers: (1) General.tsx — ChatBgGrid clears seasonalThemeOverride→'off' when any non-'none' background is picked; SeasonalBgGrid clears chatBackground→'none' when any real seasonal theme is selected. (2) SeasonalEffect.tsx — runtime guard returns null if chatBackground !== 'none', protecting against legacy persisted state.

7. Tiny Touch Targets in Composer Toolbar

• File: cinny/src/app/features/room/RoomInput.tsx
• Status: FIXED ⚠️ UNTESTED — needs verification on a real mobile device: open composer, confirm all toolbar buttons are tappable without mis-taps
• Issue: Toolbar buttons have hit areas smaller than the WCAG-recommended 44x44px for touch, hindering mobile accessibility.
• Fix Applied: Added touchTarget = { minWidth: '44px', minHeight: '44px' } computed from mobileOrTablet() and applied as style={touchTarget} to all 8 composer toolbar IconButton elements (attach, format, sticker, emoji, GIF, location, poll, schedule, send).

8. Horizontal Overflow in Room Settings

• File: cinny/src/app/components/page/style.css.ts
• Status: FIXED ⚠️ UNTESTED — needs verification: open Room Settings on a narrow mobile screen, confirm nav panel fills full width and no horizontal scrollbar appears
• Issue: Wide tables and input elements in room settings cause horizontal overflow on mobile viewports.
• Fix Applied: Added @media (max-width: 750px) { width: '100%' } to both '400' and '300' size variants of the PageNav vanilla-extract recipe in style.css.ts.

9. Modal Float-Style Responsiveness

• File: Multiple modal files
• Status: FIXED ⚠️ UNTESTED — needs verification by opening each modal on a real mobile device
• Issue: Modals appear as floating boxes on mobile, creating navigation and readability challenges.
• Fix Applied: Created useModalStyle(desktopMaxWidth) hook (src/app/hooks/useModalStyle.ts) that returns fullscreen styles on mobile (no border-radius, no max-width, height: 100%) and desktop box styles otherwise. Applied to all 22+ modal files: LeaveRoomPrompt, LeaveSpacePrompt, ReportRoomModal, ReportUserModal, DeviceVerification, InviteUserPrompt, LogoutDialog, DeviceVerificationSetup, DeviceVerificationReset, JoinAddressPrompt, JumpToTime, EditHistoryModal, ForwardMessageDialog, RemindMeDialog, CreateRoomModal, CreateSpaceModal, ScheduleMessageModal, PollCreator, AddExistingModal, RoomEncryption, RoomUpgrade, Modal500, ReadReceiptAvatars, RoomTopicViewer.
• Note: UIAFlowOverlay already fullscreen via <Overlay> — no change needed. JoinRulesSwitcher/RoomNotificationSwitcher are dropdowns, not modals.

10. Composer Keyboard Obscurity

• File: src/index.css
• Status: FIXED ⚠️ UNTESTED — needs verification on iOS Safari specifically (the worst offender); on Android Chrome 100dvh has been standard since Chrome 108
• Issue: The chat composer is often partially or fully obscured by the virtual keyboard on mobile.
• Fix Applied: Added height: 100dvh (dynamic viewport height) to html alongside the existing height: 100% fallback. dvh updates when the software keyboard appears, ensuring the layout shrinks correctly and the composer stays visible.

11. Inline Jotai atom creation

• File: cinny/src/app/hooks/useSpaceHierarchy.ts
• Status: FALSE POSITIVE — CLOSED
• Issue: Inline Jotai atom creation in a hook risks re-rendering components unnecessarily.
• Resolution: useState(() => atom(...)) IS the correct Jotai pattern for local stable atom references. The factory function form of useState ensures the atom is created only once per component mount. No change warranted.

---

📦 Barrel File Audit

File Path	Note	Status
cinny/src/app/plugins/call/index.ts	Extensive export * usage	OPEN
cinny/src/app/plugins/text-area/index.ts	Extensive export * usage	OPEN
cinny/src/app/components/message/index.ts	Extensive export * usage	OPEN

---

🔍 Technical & Performance Refinements

Category	Issue Description	File Path	Status
State Sync	Fire-and-forget network call to set offline presence during pagehide event may not complete reliably, potentially causing UI drift in presence status.	cinny/src/app/hooks/usePresenceUpdater.ts	FIXED (d2946c00) — unload path now uses fetch({ keepalive: true }) so the request survives page teardown (sendBeacon was unusable here: it can't set the auth header).
State Sync	Fire-and-forget network call setPresence().catch(...) suppresses errors, meaning the app may falsely assume presence update success.	cinny/src/app/hooks/usePresenceUpdater.ts	FIXED (d2946c00) — errors are now surfaced via warnPresenceFailure (redacted logging) instead of being silently swallowed.
Memory Leak	Decrypted Media Memory Leak (Gallery & Lightbox) due to missing virtualization and blob revocation.	cinny/src/app/features/room/MediaGallery.tsx	PARTIALLY FIXED ⚠️ UNTESTED — Blob revocation was already correct; added enabled param to useDecryptedMediaUrl and useNearViewport(300px) to each GalleryTile to gate decryption until near-viewport, reducing burst on pagination. True virtualization (windowing) deferred — requires significant refactor.
Data Persistence	Scheduled Messages are ephemeral (lost on refresh) due to fragile localStorage parsing.	cinny/src/app/state/scheduledMessages.ts	FIXED — now uses atomWithStorage + createJSONStorage (Jotai's built-in persistence with error-safe JSON parsing)
Memory Leak	Potential memory leak due to uncleaned handleMouseMove listener in usePan.	cinny/src/app/hooks/usePan.ts	FALSE POSITIVE — usePan already uses attachedRef to track listeners and cleans them up in an unmount useEffect. No change needed.
Asset Optimization	Large unoptimized media asset (213KB) found in public/res.	public/res/Lotus.png	OPEN
Data Persistence	Non-atomic localStorage updates in session management can lead to inconsistent state.	cinny/src/app/state/sessions.ts	OPEN
Data Persistence	Lack of cross-tab synchronization for localStorage updates in session management risks race conditions.	cinny/src/app/state/sessions.ts	OPEN
Network Resilience	uploadContent lacks retry logic, failing immediately upon network error.	cinny/src/app/utils/matrix.ts	FIXED (d2946c00) — bounded retry (UPLOAD_MAX_RETRY_COUNT=3) gated by isRetryableUploadError (transient/network/5xx/429 only, not 4xx), reusing the rateLimitedActions capped-exponential backoff.
Network Resilience	rateLimitedActions uses basic retry logic without exponential backoff, which may exacerbate 429 issues.	cinny/src/app/utils/matrix.ts	FIXED — fallback delay now uses capped exponential backoff (min(1000 * 2^retryCount, 30_000)ms) when server doesn't send Retry-After; server header still takes precedence via getRetryAfterMs().
Matrix Event Robustness	useMatrixEventRenderer handles unknown events gracefully by returning null, which may hide potentially important unrendered data.	cinny/src/app/hooks/useMatrixEventRenderer.ts	FALSE POSITIVE — returning null for unrendered types is the intended contract. Callers opt into rendering unknowns via the renderStateEvent / renderEvent fallback params; null only results when the caller deliberately supplies no fallback. No change warranted.
Data Contract	MatrixError instantiation with UploadResponse might be brittle.	cinny/src/app/utils/matrix.ts	FIXED (d2946c00) — replaced the brittle direct construction with matrixErrorFromUploadResponse / matrixErrorFromUnknown guards that validate shape before building a MatrixError.
Type Safety	addRoomIdToMDirect uses as any cast for AccountDataEvent.Direct, bypassing type contract validation.	cinny/src/app/utils/matrix.ts	FIXED (d2946c00) — addRoomIdToMDirect / removeRoomIdFromMDirect now use EventType.Direct + a typed MDirectContent, dropping the as any cast.
Robustness	rateLimitedActions relies on MatrixError.httpStatus which might not exist on all error variants.	cinny/src/app/utils/matrix.ts	FALSE POSITIVE — MatrixError.httpStatus is defined as readonly httpStatus?: number in matrix-js-sdk/lib/http-api/errors.d.ts. It is optional (not on all instances) but the ?. optional chain already guards against undefined. No change needed.
Type Contract	Custom types in cinny/src/types/matrix mirror SDK types instead of using them, risking drift and contract mismatches.	cinny/src/types/matrix/	OPEN

🏗️ Architectural & Hygiene Audit

Category	Issue Description	File Path	Status
Hygiene	No stale development notes or TypeScript strictness issues found	N/A	OPEN

---

🏗️ TDS Compliance & Styling Issues

Issue Description	File Path
Hardcoded inline style cursor: 'pointer'	cinny/src/app/plugins/react-custom-html-parser.tsx
Hardcoded color #00D4FF, #FFB300 ✅ VERIFIED COMPLIANT	cinny/src/app/components/event-readers/EventReaders.tsx
Hardcoded color #EE1D52, #9146ff, #ff4500, #cb3837, #f48024 ⚠️ BRAND EXCEPTION	cinny/src/app/components/url-preview/UrlPreviewCard.tsx + UrlPreview.css.tsx — official third-party brand colors in SVG logos and site badge backgrounds; cannot convert to CSS variables without inventing new tokens (violates TDS rule 3)
Massive number of hardcoded backgroundColor values ⚠️ PATTERN CONTENT EXCEPTION	cinny/src/app/features/lotus/chatBackground.ts — each background's base color is aesthetic content that defines the pattern identity; converting requires inventing 40+ CSS variables (violates TDS rule 3) or using CSS4 relative-color-syntax in inline styles (insufficient browser support); these are visual content, not UI chrome
Hardcoded colors #00FF88, #FF6B00 ✅ VERIFIED COMPLIANT	cinny/src/app/features/call/CallControls.tsx
Hardcoded fallback hexes in toast colors ✅ FIXED	cinny/src/app/features/toast/LotusToastContainer.tsx

---

🌐 Localization, Accessibility & Performance

Category	Issue Description	File Path	Status
Localization	Hardcoded UI string: "Chat Room"	src/app/components/create-room/CreateRoomTypeSelector.tsx	FIXED (1a5896ef) — wrapped in t() + key added to en.json
Localization	Hardcoded UI string: "Messages, photos, and videos."	src/app/components/create-room/CreateRoomTypeSelector.tsx	FIXED (1a5896ef) — wrapped in t() + key added to en.json
Localization	Hardcoded UI string: "Voice Room"	src/app/components/create-room/CreateRoomTypeSelector.tsx	FIXED (1a5896ef) — wrapped in t() + key added to en.json
Localization	Hardcoded UI string: "Live audio and video conversations."	src/app/components/create-room/CreateRoomTypeSelector.tsx	FIXED (1a5896ef) — wrapped in t() + key added to en.json
Localization	Hardcoded UI string: "Download"	src/app/components/image-viewer/ImageViewer.tsx	FIXED (1a5896ef) — wrapped in t() + key added to en.json
Localization	Hardcoded UI string: "Open Location"	src/app/components/message/MsgTypeRenderers.tsx	FIXED (1a5896ef) — wrapped in t() + key added to en.json
Localization	Hardcoded UI string: "Thread"	src/app/components/message/Reply.tsx	FIXED (1a5896ef) — wrapped in t() + key added to en.json
Localization	Hardcoded UI string: "View"	src/app/components/message/content/ImageContent.tsx	FIXED (1a5896ef) — wrapped in t() + key added to en.json
Localization	Hardcoded UI string: "Spoiler"	src/app/components/message/content/ImageContent.tsx	FIXED (1a5896ef) — wrapped in t() + key added to en.json
Localization	Hardcoded UI string: "Retry"	src/app/components/message/content/ImageContent.tsx	FIXED (1a5896ef) — wrapped in t() + key added to en.json
Localization	Hardcoded UI string: "Close"	src/app/components/DeviceVerification.tsx	FIXED (1a5896ef) — wrapped in t() + key added to en.json
Localization	Hardcoded UI string: "Accept"	src/app/components/DeviceVerification.tsx	FIXED (1a5896ef) — wrapped in t() + key added to en.json
Localization	Hardcoded UI string: "They Match"	src/app/components/DeviceVerification.tsx	FIXED (1a5896ef) — wrapped in t() + key added to en.json
Localization	Hardcoded UI string: "Okay"	src/app/components/DeviceVerification.tsx	FIXED (1a5896ef) — wrapped in t() + key added to en.json
Localization	Hardcoded UI string: "Join Server"	src/app/components/url-preview/UrlPreviewCard.tsx	FIXED (1a5896ef) — wrapped in t() + key added to en.json
Localization	Hardcoded UI string: "Invite"	src/app/components/invite-user-prompt/InviteUserPrompt.tsx	FIXED (1a5896ef) — wrapped in t() + key added to en.json
Localization	Hardcoded UI string: "Files"	src/app/components/upload-board/UploadBoard.tsx	FIXED (1a5896ef) — wrapped in t() + key added to en.json
Localization	Hardcoded UI string: "Send"	src/app/components/upload-board/UploadBoard.tsx	FIXED (1a5896ef) — wrapped in t() + key added to en.json
Localization	Hardcoded UI string: "Upload Failed"	src/app/components/upload-board/UploadBoard.tsx	FIXED (1a5896ef) — wrapped in t() + key added to en.json
Localization	Hardcoded UI string: "Password"	src/app/components/uia-stages/PasswordStage.tsx	FIXED (1a5896ef) — wrapped in t() + key added to en.json
Bundle Size	Large unoptimized media asset (213KB)	public/res/Lotus.png	OPEN
Matrix Logic	Inefficient repeated mx.getRoom() calls in component render loops	src/app/features/lobby/Lobby.tsx	FALSE POSITIVE — Lobby already routes its render loop through the memoized useGetRoom(allJoinedRooms). The two remaining mx.getRoom() calls are inside drag/drop event handlers (not render loops) and are O(1) SDK map lookups. No change warranted.
Matrix Logic	Inefficient repeated mx.getRoom() calls in component render loops	src/app/components/emoji-board/EmojiBoard.tsx	FIXED (b7e1f89c) — pack-label mx.getRoom() lookups in EmojiSidebar/StickerSidebar hoisted into a useMemo'd Map built once per pack list.
Performance	Numerous event handlers (e.g., handleUserClick, handleReplyClick) lack useCallback, leading to unnecessary re-renders of message components.	cinny/src/app/features/room/RoomTimeline.tsx	FIXED (b7e1f89c) — handleJumpToLatest/handleJumpToUnread/handleMarkAsRead wrapped in useCallback.
Performance	The submit function and file handling callbacks (e.g., handleSendUpload) are re-created on every render, causing re-renders of the editor and toolbar components.	cinny/src/app/features/room/RoomInput.tsx	FIXED (b7e1f89c) — handleCancelUpload/handleSendUpload/handleShareLocation/handleEmoticonSelect/handleStickerSelect wrapped in useCallback.
Accessibility	button for edit history lacks aria-label	cinny/src/app/components/message/content/FallbackContent.tsx	FIXED ⚠️ UNTESTED — added aria-label="View edit history"
Accessibility	button for reaction lacks aria-label	cinny/src/app/components/message/Reaction.tsx	FIXED ⚠️ UNTESTED — Reaction component now computes aria-label="{shortcode} reaction, N people" internally using getShortcodeFor; custom (mxc://) emoji falls back to "custom emoji reaction".
Accessibility	button for ThreadIndicator lacks aria-label	cinny/src/app/components/message/Reply.tsx	FIXED ⚠️ UNTESTED — added aria-label="View thread"
Accessibility	button for ReplyLayout lacks aria-label	cinny/src/app/components/message/Reply.tsx	FIXED ⚠️ UNTESTED — added aria-label="Jump to original message"

---

🔧 Infrastructure, DevEx & Type Safety

Category	Issue Description	File Path	Status
Dependencies	lodash pinned to non-existent version 4.18.1	cinny/package.json	OPEN
Dependencies	Various pinned versions of @atlaskit, matrix-js-sdk	cinny/package.json	OPEN
Dependencies	matrix-js-sdk pinned to Release Candidate (41.6.0-rc.0)	cinny/package.json	OPEN
Dependencies	Unstable/experimental versions for build tools (vite 8.0.14, typescript 6.0.3, eslint 9.39.4)	cinny/package.json	OPEN
CI/CD	package-manager-cache set to false	cinny/.github/workflows/build-pull-request.yml	OPEN
CI/CD	Inefficient sequential execution in deployment	cinny/.github/workflows/prod-deploy.yml	OPEN
CI/CD	Aggressive 1-minute timeout for Netlify deploy	cinny/.github/workflows/prod-deploy.yml	OPEN
DevEx	Stale upstream bug tracker link/donations/CLA	cinny/CONTRIBUTING.md	OPEN
DevEx	Alignment issue between README and CONTRIBUTING	cinny/README.md	OPEN
Testing	No evident automated testing configuration/files	cinny/src/	OPEN
Type Safety	Extensive use of as any type assertions	cinny/src/	OPEN
Security	Hardcoded public CDN URL; consider moving to environment variable	/root/code/cinny/scripts/syncDecorations.mjs	OPEN
Architecture	Modifying node_modules directly is brittle; use patch-package instead	/root/code/cinny/scripts/patch-folds.mjs	OPEN
Robustness	Missing security headers (HSTS, CSP, etc.) and inefficient asset serving using rewrites instead of try_files	/root/code/cinny/contrib/nginx/cinny.domain.tld.conf	OPEN
Robustness	Incomplete documentation/placeholder path in Caddyfile	/root/code/cinny/contrib/caddy/caddyfile	OPEN
Matrix SDK	Inefficient listener management (setMaxListeners: 150) and incomplete SDK state transition handling.	src/client/initMatrix.ts	OPEN
PWA Robustness	Service worker lacks caching strategy for application assets, resulting in no offline capability.	cinny/src/sw.ts	OPEN
PWA Integrity	manifest: false in vite.config.js might prevent correct PWA installation if not handled externally.	cinny/vite.config.js	OPEN
PII Leakage	Potential PII exposure via console.error (parameter e likely contains event data).	cinny/src/app/plugins/call/CallEmbed.ts	VERIFIED COMPLIANT — reviewed during the logging pass (203568c9); the existing log path already records only e.message, not raw event payloads. No change needed.
PII Leakage	Potential PII exposure via console.warn (parameter imgError/videoError/thumbError object).	cinny/src/app/features/room/msgContent.ts	FIXED (203568c9) — media-error warnings now log only error.name + error.message, never the raw error/event object.
PII Leakage	Potential PII exposure via console.error (parameter e likely contains event data).	cinny/src/app/features/room/RoomInput.tsx	VERIFIED COMPLIANT — reviewed during the logging pass (203568c9); the existing log path already records only e.message. No change needed.

🏗️ Architectural & Resilience Audit

Category	Issue Description	File Path	Status
Element Call Integration	Lacks robust iframe failure monitoring beyond initial 'preparing' event; can result in a permanently hung 'Loading...' state with no user-visible error or recovery path.	src/app/plugins/call/CallEmbed.ts	FIXED (0394fce9) — added a CALL_LOAD_WATCHDOG_MS (25s) timeout that settles on ready/capabilities/joined and fails on iframe error/timeout, exposing a loadFailed getter + onLoadError(cb). CallView renders a CallLoadErrorMessage overlay (Retry/Leave) instead of a permanent spinner. ⚠️ UNTESTED — needs a live call.
Component Resilience	RoomTimeline has no ErrorBoundary wrapper — a single malformed event crashing the renderer takes down the entire timeline with no fallback UI.	src/app/features/room/RoomTimeline.tsx	FALSE POSITIVE — RoomView.tsx (lines 113–137) already wraps <RoomTimeline> in a react-error-boundary ErrorBoundary with a "Timeline unavailable" fallback. A wave-1 agent's redundant nested boundary was reverted. No change needed.
Component Resilience	RoomInput has no ErrorBoundary wrapper — a crash in the composer leaves users unable to send messages.	src/app/features/room/RoomInput.tsx	FALSE POSITIVE — RoomView.tsx (lines 151–171) already wraps <RoomInput> in an ErrorBoundary with a "Message composer encountered an error" RoomInputPlaceholder fallback. No change needed.
Fallback Logic	No explicit empty/error fallback for Matrix SDK data calls in RoomTimeline; relies purely on SDK internal error propagation, meaning silent failures show a blank timeline.	src/app/features/room/RoomTimeline.tsx	ADDRESSED — the RoomView ErrorBoundary (above) provides the explicit render-error fallback; a thrown SDK/render error now surfaces "Timeline unavailable" rather than a blank timeline.
Dependency	Potential for complex dependency chains due to deep nesting in src/app/features/ and src/app/hooks/.	src/app/	OPEN
Hydration/Race Condition	The SyncState listener registered by useSyncState may miss the initial 'PREPARED' event if the client initializes synchronously from IndexedDB before the effect runs, leading to an infinite loading state.	cinny/src/app/pages/client/ClientRoot.tsx	OPEN
Structure	High number of small, highly coupled utility hooks (src/app/hooks/) may obscure dependency graphs.	src/app/hooks/	OPEN
Dead Code	Potential for unused CSS modules or UI components in src/app/features/.	src/app/	OPEN
Security	Sensitive session data (access tokens, device ID) stored in localStorage is vulnerable to XSS.	src/app/state/sessions.ts	OPEN
Privacy	Sensitive user status messages and expiry timestamps are persisted in localStorage.	src/app/features/settings/account/Profile.tsx	OPEN
Privacy	Unsent composer drafts stored in localStorage without encryption could leak info on shared devices.	src/app/features/room/RoomInput.tsx	OPEN
Persistence	Scheduled messages relying on fragile localStorage parsing are prone to data loss on session expiry or error.	src/app/state/scheduledMessages.ts	OPEN
Bundle Bloat	Inefficient lodash import; risks including entire library instead of necessary utilities.	cinny/package.json	OPEN
Bundle Bloat	Large matrix-js-sdk (RC version) dependency; high potential for tree-shaking overhead.	cinny/package.json	OPEN
Build-Time Overhead	lotusDenoise plugin performs heavy, sequential fs operations during closeBundle, significantly slowing build times.	cinny/vite.config.js	OPEN
Build-Time Overhead	Complex manual viteStaticCopy configuration requiring multiple renames and path manipulations; risks redundant processing.	cinny/vite.config.js	OPEN
Architectural Debt	Redundant style variant logic in SpacingVariant could be simplified.	cinny/src/app/components/message/layout/layout.css.ts	OPEN
Overhead Analysis	Potential CSS bloat from DropTarget composition across multiple recipes (SidebarItem, SidebarFolder).	cinny/src/app/components/sidebar/Sidebar.css.ts	OPEN

🏗️ Git Workflow & History Audit

Category	Issue Description	File Path	Status
Workflow	Monolithic "Fix all bugs" commits (e.g., 10f6544e, aa48c9ef) make git bisect difficult.	Git History	OPEN
Workflow	Inconsistent commit message prefixes (e.g., fix, feat, docs, assets).	Git History	OPEN
Workflow	Use of fix or feat for large-scale changes affecting multiple disparate systems (e.g., 938ead79).	Git History	OPEN

---

🎨 Native UI/UX Consistency — Lotus vs. Cinny Baseline

Audit of every Lotus-custom UI feature against Cinny's native folds design-system conventions. "Native pattern" means the folds component library, vanilla-extract tokens (color.*, config.radii.*, config.space.*), and established Cinny component patterns. 52 findings, organized by severity.

---

🔴 Major — Broken Styling / Functional Regressions

N1. ProfileDecoration Save Button — Undefined --accent-cyan Variable (border invisible on all non-TDS themes)

• File: src/app/features/settings/account/ProfileDecoration.tsx, lines 191–213
• Status: FIXED — replaced raw <button> with <Button size="400" variant="Success" fill="Solid" radii="300">, removed undefined --accent-cyan reference
• Issue: The save button is a raw <button> with border: '1px solid var(--accent-cyan)' and color: 'var(--accent-cyan)'. The variable --accent-cyan (without the --lt- prefix) is never defined in any theme file — the correct prefixed form is --lt-accent-cyan. On all non-TDS themes the border is invisible and the text has no color.
• Root Cause: Missing --lt- prefix. Additionally, the raw <button> should be a folds <Button> to match every other save button in the same Profile.tsx settings panel (e.g., ProfileDisplayName save at Profile.tsx:303).
• Fix: Replace raw <button> with <Button size="400" variant="Success" fill="Solid" radii="300">. Remove the --accent-cyan reference.

N2. UserPrivateNotes Textarea — Undefined --border-interactive Variable (border invisible on all themes)

• File: src/app/components/user-profile/UserRoomProfile.tsx, lines 246–265
• Status: FIXED — replaced undefined CSS vars with color.SurfaceVariant.ContainerLine, config.radii.R300, config.space.S200/S300
• Issue: The notes textarea sets border: '1px solid var(--border-interactive)'. This variable is never defined anywhere in the codebase — the correct equivalents are --bg-surface-border (src/index.css) or color.SurfaceVariant.ContainerLine (folds token). The border is invisible on all themes.
• Root Cause: Invented CSS variable name. Also uses raw pixel sizing (borderRadius: '6px', padding: '8px 10px', fontSize: '14px') instead of folds tokens.
• Fix: Replace inline style with border: \1px solid ${color.SurfaceVariant.ContainerLine}`, borderRadius: config.radii.R300, padding: config.space.S200`.

N3. LotusToastContainer — Z-Index Places Toasts Below Night Light Overlay and All Modals

• File: src/app/features/toast/LotusToastContainer.tsx, lines 184–211; src/app/pages/App.tsx
• Status: FIXED — raised toast zIndex from 9997 to 10001 (above Night Light at 9998 and modals at 9999)
• Issue: The toast container uses hardcoded zIndex: 9997. The Night Light overlay is at z-index: 9998. The folds Overlay/Dialog components used for all modals resolve to z-index: 9999. Result: (a) toasts render under the Night Light tint and take on the warm orange filter; (b) any open modal covers toasts entirely, making notifications invisible.
• Root Cause: The toast container does not use the folds OverlayContainerProvider portal that manages z-index correctly — it is a plain position: fixed div injected directly in App.tsx.
• Fix: Either route the toast portal through OverlayContainerProvider (matching how all other floating UI works), or raise zIndex above all overlay layers (10001+). Also audit Night Light's z-index (9998) relative to toasts.

N4. PollContent Vote Buttons — Entirely Outside the Folds Design System

• File: src/app/components/message/content/PollContent.tsx
• Status: FIXED ✅ VERIFIED (caf6318a) — confirmed renders correctly on default Cinny themes and with Lotus TDS enabled; borders, selected state, and progress fill all visible.
• Issue: Each poll answer is a native <button> with ~15 hardcoded inline style properties using undefined CSS variables (--accent-cyan, --accent-cyan-dim, --accent-cyan-border, --border-color). Checkbox/radio indicators, percentage spans, and the poll label used raw pixel/rem font sizes (0.68rem, 0.78rem, 0.88rem) and hardcoded rgba()/#fff. None of those vars exist outside TDS mode — the component rendered unstyled (invisible borders / no selected/progress state) on every non-TDS theme.
• Root Cause: Custom implementation that bypassed folds tokens entirely.
• Fix Applied: Kept the <button> structure (the progress-bar-behind-text affordance has no folds Button equivalent) but made every value theme-reactive: color.Primary.* for selected/indicator state, color.SurfaceVariant.* for the resting surface + progress fill, config.* for radii/spacing/border-width, and folds <Text> for the option label, percentage, and section label (dropping the raw rem sizes and opacity hacks). The duplicate checkbox/radio indicator spans were merged into one.

---

🟠 Moderate — Interaction Pattern or Visual Deviations

#	Area	File	Lines	Issue	Native Pattern
N5	Read Receipts	ReadReceiptAvatars.tsx	62–137	Trigger button is raw <button> with onMouseEnter/onMouseLeave JS style mutation for hover state — FIXED: hover/focus emphasis moved to co-located ReadReceiptAvatars.css.ts (:hover/:focus-visible), no JS .style mutation	All interactive elements use useHover from react-aria and folds variant system for hover; direct .style mutation used nowhere else on buttons
N6	Read Receipts	ReadReceiptAvatars.tsx & Message.tsx	32–56 / 268–283	Two code paths open EventReaders: avatar-pill path uses useModalStyle(360) for mobile fullscreen; context-menu path (MessageReadReceiptItem) does not — on mobile the context menu path opens a fixed-size non-fullscreen modal for the same content	All modals that share a layout variant use useModalStyle consistently; MessageReadReceiptItem was not updated when useModalStyle was added
N7	Delivery Status	Message.tsx	89–148	DeliveryStatus renders Unicode glyphs (⟳ ✓ ✕) in a <span> with fontSize: '10px' instead of folds <Icon> components — FIXED: replaced with Icons.Check/Cross/Send via <Icon size="100">	Icons.Check, Icons.Cross, etc. are used for all other status glyphs; folds Text size tokens for all supplementary text
N8	GIF Picker	GifPicker.tsx	83–124	GIF picker container uses fully bespoke inline styles (borderRadius: '12px', boxShadow: '0 8px 32px rgba(0,0,0,0.4)', raw rgba border) — two separate style sets for TDS and non-TDS paths — FIXED: non-TDS path now uses folds tokens (color.Surface.Container, config.radii.R400, color.Surface.ContainerLine, color.Other.Shadow), dropping the undefined var(--bg-surface); the TDS branch keeps its --lt-* glow chrome (valid TDS styling)	EmojiBoard has no caller-applied container styling; folds components handle their own surface internally via design tokens
N9	GIF Button	RoomInput.tsx	1076–1087	GIF toolbar button renders <Text size="T200"> with hand-rolled fontWeight/fontSize/letterSpacing instead of <Icon> — WON'T FIX (deliberate): folds has no GIF icon, and "GIF" is a widely-recognized text affordance (Slack/Discord/Element all use a text label). Converting to an arbitrary icon would be less clear, not more.	All 8 other toolbar buttons (Smile, Sticker, Location, Poll, etc.) use <Icon src={...} /> exclusively
N10	Send Animation	Message.tsx + Animations.css.ts	979–998 / 60–71	MsgAppearClass and MentionHighlightPulse both animate transform: scale on the same MessageBase DOM node — on self-sent mention messages both classes apply simultaneously and fight over the transform property — FIXED: mentionPulseKeyframes now animates only box-shadow (dropped the imperceptible scale(1.003)), so the appear-scale and the mention glow no longer contend for transform	Pre-existing highlightAnime only animates backgroundColor; no prior transform animation on MessageBase
N11	AvatarDecoration	AvatarDecoration.tsx	5 / 38–41	Fixed 8px inset on all sides regardless of avatar size — at folds size "200" (~32px) the decoration bleeds 50% of the avatar diameter, clipping against overflow: hidden parent containers in member lists. Inset issue still OPEN. Related regression fixed in useAvatarDecoration.ts: the decoration fetch cached all failures (including transient 429/5xx) as "no decoration" permanently for the session, so a single rate-limited burst (member list / timeline mount many avatars at once) would make decorations vanish until a full reload. Now only a genuine 404 is cached; transient errors retry on the next mount.	Folds Avatar and PresenceRingAvatar do not emit overflow outside their bounding box
N12	MediaGallery Drawer	MediaGallery.tsx	651–661	Drawer uses position: 'fixed' with hardcoded width: '320px' as inline styles on a <Box> — FIXED: moved positioning/width into co-located MediaGallery.css.ts using toRem(320) + a max-width: 750px full-screen media query (mirrors MembersDrawer); border/header now use config.borderWidth/config.space tokens. Added Escape-to-close on the panel (previously only the lightbox handled Escape). Full chrome redesign (round 2) to match native conventions: panel + header switched from Surface to Background variant (matching MembersDrawer/Saved Messages); header now Text size="H4" + plain close IconButton (dropped the bespoke tooltip-wrapped button); tabs moved to a bordered toolbar strip with the variant={active?'Primary':'Secondary'} fill={active?'Solid':'Soft'} pattern from PolicyListViewer and now show per-tab counts; the centered "lines + label" month divider replaced with a left-aligned group label (Cinny group-label pattern); thumbnail tiles moved hover/focus styling to CSS :hover/:focus-visible (no JS hover state) and into MediaGallery.css.ts; file rows + grid tokenized. Docking fix (round 3) — the core of the finding: the gallery was a position: fixed overlay floating over the timeline, mounted from RoomViewHeader. It is now a docked flex sibling in the room layout row, exactly like MembersDrawer: open state lifted to a mediaGalleryAtom (mirrors bookmarksPanelAtom), rendered in Room.tsx with a vertical Line separator on desktop and key={room.roomId} to reset per room; the CSS is static-width on desktop and only position: fixed; inset: 0 full-screen on mobile (identical strategy to MembersDrawer.css). It now shares the row with the timeline instead of overlapping it.	MembersDrawer uses a vanilla-extract class with width: toRem(266) and is placed by the layout system, not position: fixed. 54px width discrepancy also breaks visual rhythm if both panels could be open
N13	ScheduledMessagesTray	ScheduledMessagesTray.tsx	108–126	Collapsible tray header is <Box as="button"> with cursor: 'pointer' inline style and no folds variant — no hover state, no focus ring — FIXED: replaced with folds <Button variant="Secondary" fill="None" radii="0"> using before/after icon props (gains design-system hover/focus)	All clickable header/toggle elements in the room view use folds <Button> or <IconButton> with explicit variants for hover/focus; <Box as="button"> with no variant is used nowhere else
N14	ForwardMessageDialog	ForwardMessageDialog.tsx	137–154	Dialog uses <Modal> but has no <Header> component and no close <IconButton> — only way to close is clicking outside — FIXED: added a folds <Header variant="Surface" size="500"> with the title + close <IconButton radii="300">, matching every other modal	Every other modal using <Modal> or <Box role="dialog"> includes a <Header> with a close <IconButton> in the top-right (EditHistoryModal, LeaveRoomPrompt, ScheduleMessageModal, RemindMeDialog, etc.)
N15	ScheduleMessageModal	ScheduleMessageModal.tsx	180–193	Modal root is <Box as="form" role="dialog"> with manually assembled borderRadius: config.radii.R400/boxShadow — FIXED: shell is now <Dialog as="form" variant="Surface">; removed inline surface styles	ForwardMessageDialog uses folds <Modal size="400"> with R500 radius; the R400 vs R500 mismatch is visible when both dialogs appear in the same session
N16	Presence Picker	SettingsTab.tsx	118–144	Presence trigger dot is raw <button> with position: absolute; bottom: 2; right: 2 inline and no folds focus ring; no tooltip — FIXED: wrapped the trigger in a folds TooltipProvider (shows "Status: …"); replaced the undefined var(--bg-surface) with color.Background.Container. Kept the absolute-positioned <button> (it overlays the avatar corner; a full IconButton would be too large for the dot).	Every other sidebar icon button uses folds IconButton with SidebarItemTooltip and TooltipProvider
N17	Presence Picker	SettingsTab.tsx	80–86	PresencePicker FocusTrap missing escapeDeactivates: stopPropagation and isKeyForward/isKeyBackward — FIXED: added all three options, matching the theme selector / sort menus	Every other PopOut+FocusTrap+Menu combo supplies both (theme selector General.tsx:143–160, SettingsSelect, sort menus) — without it Escape bubbles past the trap and arrow-key navigation is absent
N18	Profile Selects	Profile.tsx	547–575 / 816–848	ProfileStatus auto-clear and ProfileTimezone selectors are native <select> elements with hardcoded colorScheme: 'dark' — will render in dark mode on light themes	General.tsx uses folds SettingsSelect<T> (Button+PopOut+Menu) for all dropdowns; colorScheme: 'dark' breaks light/custom theme appearance
N19	Presence Labels	useUserPresence.ts vs SettingsTab.tsx	55–62 / 36–42	PresenceBadge tooltip shows "Active / Busy / Away"; PresencePicker options read "Online / Idle / Do Not Disturb / Invisible" — a DND user shows tooltip "Busy", not "Do Not Disturb" — FIXED: aligned usePresenceLabel reader vocabulary to the setter (online→"Online", unavailable→"Idle", offline→"Offline")	Within the same Lotus feature set the user-facing vocabulary is inconsistent between the setter UI and the reader tooltip
N20	Notification Presets	Notifications.tsx	57–107	Gaming/Work/Sleep preset buttons are bare <button> elements with Lotus-specific CSS vars (--border-interactive-normal, --bg-surface-low) not defined in all themes — FIXED: converted to folds <Button variant="Secondary" fill="Soft" radii="300"> (auto height) wrapping the emoji/label/description column; undefined vars removed	Grouped preset/action buttons elsewhere use folds Chip variant="Primary/Secondary" outlined radii="Pill" (e.g., Composer Toolbar toggles in General.tsx:1100–1113)
N21	Notification Sound Selects	SystemNotification.tsx	111–305	Message sound, invite sound, and quiet-hours time pickers are bare <select>/<input type="time"> with colorScheme: 'dark' workaround	All other dropdowns in settings use the Button+PopOut+Menu+MenuItem folds pattern; the native select renders OS-styled on all platforms
N22	DM Preview Virtualizer	RoomNavItem.tsx / Direct.tsx	608–627 / 232	DM preview adds a second text row to each DM item, making it taller than 38px, but useVirtualizer in Direct.tsx still uses estimateSize: () => 38 — causes layout jump/overlap on initial render — FIXED: bumped estimateSize to 52 (the two-line DM-row height) so the initial estimate matches the common case; measureElement still corrects each row exactly	Non-DM rooms in Home.tsx also estimate 38px; DM items with a preview are now a different height, creating two visual densities in the same nav column
N23	RoomServerACL	RoomServerACL.tsx	100–115 / 298–309	Server-name text input is a raw <input type="text"> with inline style object; "Allow IP literal addresses" is a raw <input type="checkbox"> with style={{ width: 16, height: 16 }} — FIXED: text input → folds <Input variant={error?'Critical':'Secondary'}>; checkbox → folds <Checkbox variant="Primary">	All other text/boolean controls in room settings use folds Input and Checkbox components (RoomAddress.tsx:163, RoomAddress.tsx:330)
N24	PolicyListViewer	PolicyListViewer.tsx	245–264	Room-ID add input is a raw <input type="text"> with manually replicated folds token values — FIXED: replaced with folds <Input variant={error?'Critical':'Secondary'} size="400" radii="300">	Native pattern: folds <Input variant="Secondary" size="300" radii="300"> — no inline style needed
N25	ExportRoomHistory Inputs	ExportRoomHistory.tsx	258–292	Both date range pickers are raw <input type="date"> with inline styles — FIXED: replaced with folds <Input type="date" variant="Secondary" size="400" radii="300">	Native pattern: folds Input component; <input type="date"> renders OS-native date picker, unstyled relative to the rest of the settings panel
N26	RoomShareInvite QR	RoomShareInvite.tsx	66–73	QR code <img> has no onError handler and no loading state — broken-image placeholder shown when the external API is unreachable — FIXED: added loading="lazy" + onError that swaps to a folds "QR code unavailable" placeholder card	Cinny avatar components and MediaGallery use onError handlers; this is the only settings element making a request to a third-party server with no graceful degradation

---

🟡 Minor — Cosmetic / Token Discipline

#	Area	File	Lines	Issue	Native Pattern
N27	GIF Picker	GifPicker.tsx	103–110	FocusTrap omits returnFocusOnDeactivate: false — focus returns to GIF button on dismiss instead of staying in the editor — FIXED: added returnFocusOnDeactivate: false (matches EmojiBoard)	EmojiBoard in RoomInput.tsx:978 explicitly sets returnFocusOnDeactivate={false}; GIF picker dismiss behaviour is inconsistent with emoji picker
N28	Character Counter	RoomInput.tsx	1159–1174	Composer character counter rendered with color: 'var(--tc-surface-low)' and raw pixel padding — a CSS variable not used anywhere else in the codebase — FIXED: removed undefined var and raw opacity; now <Text priority="300"> with config.space.S100 padding	Use color.* folds tokens or priority="300" on a Text component
N29	PollCreator Modal	PollCreator.tsx	103–116	Modal root is <Box as="form" role="dialog" aria-modal="true"> with manually assembled surface styles instead of folds <Dialog variant="Surface"> — FIXED: shell is now <Dialog as="form" variant="Surface">; removed inline surface styles	MessageDeleteItem and MessageReportItem in Message.tsx:506,635 use <Dialog variant="Surface"> inside OverlayCenter > FocusTrap
N30	Playback Speed Chip	AudioContent.tsx	163–189	Speed chip uses variant="SurfaceVariant" radii="Pill" while adjacent Play/Pause chip uses variant="Secondary" radii="300" — mismatched shape and variant within the same leftControl row — FIXED: changed speed chip to variant="Secondary" radii="300"	Controls grouped in the same row should share variant and radii
N31	Collapsible Message Toggle	MsgTypeRenderers.tsx	97–105	"Read more ↓" / "Show less ↑" uses <Button size="300" variant="Secondary" fill="None"> — visually a padded form button — FIXED: replaced with the native flush inline-button pattern (background:none;border:none;padding:0) + <Text size="T200"> tinted color.Primary.Main, matching (edited) in FallbackContent	Inline text toggles in message content (e.g. (edited) in FallbackContent.tsx:74) use bare <button> with background: none; border: none; padding: 0 to stay flush with text
N32	ReadReceiptAvatars Pill	ReadReceiptAvatars.tsx	95–103	Pill border is '1px solid rgba(0,212,255,0.30)' hardcoded raw rgba string; borderRadius: '999px' not a folds radii token; padding in raw pixels — FIXED: replaced with config.borderWidth.B300, config.radii.Pill, config.space.S100/S200	Use color.* folds tokens and config.radii.Pill / config.space.S*
N33	ReadReceiptAvatars Class	ReadReceiptAvatars.tsx	67	className="receipt-pill-btn" references a class never defined — FIXED: removed dead className	All custom CSS goes through co-located vanilla-extract *.css.ts files
N34	EventReaders Header Size	EventReaders.tsx	70	Header size="600" (56px tall) while all peer message-action modals use size="500" (48px) — FIXED: changed to size="500"	EditHistoryModal, LeaveRoomPrompt, MessageDeleteItem, MessageReportItem all use size="500"; size="600" is reserved for full-page panel headers
N35	EventReaders Close Button	EventReaders.tsx	96	Close IconButton missing explicit radii="300" prop — FIXED: added radii="300"	Every peer modal close button explicitly sets radii="300" (EditHistoryModal:184, LeaveRoomPrompt:75, MessageDeleteItem:517)
N36	EventReaders Header Border	EventReaders.tsx	72–77	Lotus-mode header sets borderBottom: '1px solid var(--lt-border-color)' as a CSS shorthand string — FIXED: changed to borderBottomWidth: config.borderWidth.B300	Native modals use borderBottomWidth: config.borderWidth.B300 to avoid overriding the border-color set by the folds variant system
N37	EventReaders Timestamp	EventReaders.tsx	143–151	Lotus path sets fontSize: '0.72rem' inline — a raw relative unit between folds T200 and T100 scale steps — FIXED: removed raw fontSize, added priority="300"	Use folds Text size="T200" priority="300" for subdued secondary text
N38	BookmarksPanel Header	BookmarksPanel.tsx	155–196	Header uses variant="Surface" and close button uses size="300" radii="300"; also has a SurfaceVariant search bar strip with no equivalent in any native drawer — FIXED (full redesign): rebuilt the whole "Saved Messages" panel to match the canonical MembersDrawer — co-located BookmarksPanel.css.ts (toRem(266) + max-width:750px full-screen media query, replacing the old position:absolute; zIndex:100 mobile "modal" that had no backdrop/escape), variant="Background" header, room avatars on each item (was a generic hash icon), priority tokens replacing all raw opacity hacks, the borderLeft:3px accent removed, and Escape-to-close added.	MembersDrawer header uses variant="Background" and default-size close button; the extra search+count strip creates a structurally different component family
N39	Forward Menu Icon	Message.tsx	1150	Forward context menu item's after icon has no size="100" prop — FIXED: added size="100" to the ArrowRight icon	Every other after-icon in the same menu block explicitly uses size="100" (Reply, Reaction, Edit, Remind Me, Bookmark); missing size causes the Forward icon to render larger
N40	ProfileDecoration Remove Button	ProfileDecoration.tsx	185	"Remove" link is a raw <button> with background: 'none'; color: 'var(--tc-surface-low-contrast)' — an undefined CSS variable — FIXED: replaced with <Button variant="Critical" fill="None" size="300" radii="300">	Use folds <Button variant="Critical" fill="None"> or a Text-styled inline link
N41	PresenceBadge / UserNotes Saving	UserRoomProfile.tsx	240–244	"Saving…" indicator is <Text opacity={0.5}> without a spinner — FIXED: now shows a folds <Spinner variant="Success" fill="Solid" size="100"> beside the "Saving…" text	Every other save operation in Profile.tsx shows a folds <Spinner variant="Success" fill="Solid" size="300"> alongside the save button
N42	Character Counter Convention	UserRoomProfile.tsx vs Profile.tsx	243 / 479–490	UserPrivateNotes shows remaining count "N left", appears only under 100; ProfileStatus shows "current / 64" always with color progression	Two Lotus features in the same settings flow use different counter conventions; neither matches a pre-existing Cinny pattern
N43	Night Light Slider	General.tsx	554–565	Night Light intensity slider is a raw <input type="range"> with no accentColor token — renders in browser-default blue on all themes — FIXED: added accentColor: color.Primary.Main; the intensity label opacity hack also replaced with priority="300"	The Gate Threshold slider at General.tsx:1456 at minimum sets accentColor: 'var(--accent-orange)'; the Night Light slider does neither
N44	Mention Highlight & Boot Button	General.tsx	597–677	<input type="color"> for mention highlight uses raw pixel dimensions (width: '36px', height: '28px', borderRadius: '4px'); Reset and Boot buttons are bare <button> with Lotus CSS vars — PARTIALLY FIXED: the mention-highlight Reset button (renders on all themes) is now a folds <Button variant="Secondary" fill="Soft">, removing the undefined --border-interactive-normal var. The Boot button is deliberately kept as-is: it only renders when lotusTerminal is active, i.e. exactly when the --accent-orange* TDS vars are defined. The <input type="color"> itself is tracked separately as N69.	Adjacent settings controls use folds IconButton/Button; there is no other <input type="color"> in the Cinny settings UI
N45	SettingsSelect vs SelectTheme	General.tsx	126 vs 197	SettingsSelect trigger uses variant="Secondary" while SelectTheme uses variant="Primary" outlined fill="Soft" for the same Button+PopOut dropdown pattern — adjacent rows in the same Appearance section have different visual weight — FIXED: SelectTheme trigger changed to variant="Secondary" to match SettingsSelect	Dropdown triggers should share the same variant within the same settings section
N46	RoomInsights SectionHeader	RoomInsights.tsx	24–37	SectionHeader adds textTransform: 'uppercase', letterSpacing: '0.06em', opacity: 0.6 to Text size="L400" — FIXED: simplified to <Text size="L400" priority="300">	Every other settings panel uses bare <Text size="L400">Label</Text> with no transforms (General.tsx:52–72, ExportRoomHistory.tsx:220,246)
N47	RoomInsights Chart Radii	RoomInsights.tsx	350–356 / 415–436	Bar chart uses borderRadius: 3 and histogram bars use borderRadius: '2px 2px 0 0' as raw pixel integers — FIXED: replaced with config.radii.R300	All other rounded corners use config.radii.* tokens
N48	RoomInsights Font Size	RoomInsights.tsx	448	Hour-axis labels set style={{ fontSize: 9 }} as a raw pixel integer — overrides the folds Text size="T200" applied on the same element — FIXED: removed raw style={{ fontSize: 9 }}	Use only folds Text size props; never override with raw fontSize
N49	RoomInsights Emoji Icons	RoomInsights.tsx	41–65 / 292–295	StatTile uses literal Unicode emoji (🖼️ 🎬 🎵 📎) in <Text size="H4"> as icons — FIXED: StatTile now takes an icon: IconSrc and renders <Icon> using Icons.Photo/VideoCamera/Headphone/File	All other iconographic elements use <Icon src={Icons.*} /> from folds — emoji rendering varies between Windows/macOS/Linux and cannot be tinted by the theme
N50	RoomInsights Warning Banner	RoomInsights.tsx	168–192	Disclaimer banner uses raw <Box style={{ border: color.Warning.Main, background: color.Warning.Container }}> — FIXED: replaced with <SequenceCard variant="SurfaceVariant"> with <Icon> colored via color.Warning.Main	Settings panel informational cards use <SequenceCard variant="SurfaceVariant"> throughout RoomServerACL, ExportRoomHistory, PolicyListViewer
N51	ExportRoomHistory Progress	ExportRoomHistory.tsx	311–314	Export progress shows as a plain Text string ("Exporting… N messages") — WON'T FIX (deliberate): unlike BackupRestore (which has a known total to drive a determinate ProgressBar), export has no known total — it counts messages as they stream. The operation already shows a folds Spinner in the button plus a live count, which is the correct affordance for an indeterminate task.	BackupRestore.tsx:72,90 uses a folds <ProgressBar variant="Secondary" size="300"> for the same kind of long async operation
N52	MessageQuickReactions Empty Return	Message.tsx	160	if (recentEmojis.length === 0) return <span />; — injects an invisible DOM node into the hover action bar flex container — FIXED: changed to return null	Universal convention for empty renders in Cinny is return null; 144+ instances across the codebase; the empty <span> can affect flex spacing

---

Round 2 — Additional Feature Areas

🔴 Additional Major Findings

N53 — PTT Badge (Lotus Terminal path): Raw <div> tree with --lt-* CSS vars instead of folds <Chip>

• File: src/app/features/call/CallControls.tsx
• Status: FIXED (50076962) — removed the lotusTerminal branch entirely; the PTT badge is now the single folds <Chip variant={pttActive ? 'Success' : 'Warning'} fill="Soft" radii="400" outlined> path for all themes (TDS styling still flows through the CSS-variable layer over the Chip). Dropped the now-unused lotusTerminal read. Build-verified; visual parity to confirm only if you specifically used the terminal-mode PTT look.
• Issue: When lotusTerminal is true the PTT badge renders as a bare <Box> with inline styles referencing --lt-accent-green-dim, --lt-accent-green-border, --lt-accent-green — variables absent outside TDS mode — hardcoded rem padding, borderRadius: '99px' (non-token), a raw monospace fontFamily string, non-token letterSpacing, and a raw animation: CSS string for the live-pulse dot. The live ● dot is a raw <span> with inline style.
• Root Cause: Two entirely separate component trees for the same badge depending on a theme boolean. The non-terminal path (lines 284–301) uses the correct <Chip variant="Success"|"Warning" fill="Soft" radii="400" outlined>.
• Fix: Remove the terminal branch. The standard <Chip> path already exists and TDS theming can be applied via the CSS variable layer without a separate component tree.

N54 — PiP Mute Overlay Badges: Raw <div> instead of folds <Badge>/<Chip>

• File: src/app/components/CallEmbedProvider.tsx, lines 438–477
• Status: FIXED — replaced hardcoded borderRadius/padding/fontSize with config.radii.R300, config.space.S100/S200 tokens; replaced raw <span> text with folds <Text size="T200">; color now applied to the Icon/Text via color.Critical/Warning.Main. The dark translucent scrim (rgba(0,0,0,0.65)) is deliberately retained: these badges overlay arbitrary video, where a theme Chip/Badge surface token would not guarantee legibility. They are also non-interactive (pointerEvents: 'none'), so an interactive Chip (a <button>) is semantically wrong.
• Issue: Both the "You muted" (bottom-left) and "All muted" (top-right) PiP badges are raw <div> elements with hardcoded background: 'rgba(0,0,0,0.65)', backdropFilter: 'blur(4px)', borderRadius: '6px', padding: '3px 7px', fontSize: '12px'. Color is set as color: color.Critical.Main directly on the wrapper <div>, not via a folds variant prop. Text is <span style={{ fontSize: '11px', fontWeight: 600 }}>.
• Root Cause: CallView.tsx line 127 uses <Badge variant="Critical" fill="Solid" size="400"> in the same file for the "N Live" indicator — the native pattern exists and is unused here.

N55 — Chat Background / Seasonal Theme Selected State Uses color.Critical.Main (Error Red)

• File: src/app/features/settings/general/General.tsx, lines 1660–1661 and 1726–1728
• Status: FIXED — replaced all 4 instances of color.Critical.Main with color.Primary.Main in General.tsx
• Issue: The selected-state border for both ChatBgGrid and SeasonalBgGrid is border: \2px solid ${color.Critical.Main}`and the label color is alsocolor.Critical.Main. color.Critical.Main` is the semantic token for destructive/error states — it is used for "Leave Room", "Delete Message", "Report Room" in the same file. A normal selection indicator rendered in error red is semantically wrong and visually alarming.
• Root Cause: Wrong semantic token for an active/selected state.
• Fix: Replace color.Critical.Main with color.Primary.Main (or color.Success.Main to match how other settings selections are styled) for both the border and label color.

N56 — Report Modal Category Dropdown: Native <select> Instead of folds Chip+PopOut+Menu

• File: src/app/features/room/ReportRoomModal.tsx lines 138–163; src/app/features/room/ReportUserModal.tsx lines 144–169
• Status: FIXED — extracted a shared ReportCategorySelect component (src/app/features/room/ReportCategorySelect.tsx) using the folds Button trigger + PopOut + FocusTrap + Menu + MenuItem pattern (with escapeDeactivates/arrow-key nav, matching OrderButton); both modals now use it instead of the native <select>.
• Issue: Both report modals render the "Category" field as <Box as="select"> with hand-rolled inline styles (padding, border, background, color, fontSize, fontFamily). No other selector in the message-action modal context uses <select> — the established pattern for all dropdowns in both message modals and search filters is Chip onClick → setMenuAnchor → PopOut → FocusTrap → Menu → MenuItem (reference: OrderButton in SearchFilters.tsx lines 63–114).

---

🟠 Additional Moderate Findings

#	Area	File	Lines	Issue	Native Pattern
N57	PiP Fullscreen Button	CallEmbedProvider.tsx	929–951	PiP fullscreen toggle is a raw <button> with background: 'rgba(0,0,0,0.65)', color: '#fff', fontSize: '13px', Unicode ⛶/⊡ glyph — no focus ring, no tooltip — FIXED (token discipline): borderRadius/padding/gap replaced with config.radii.R300 + config.space.* tokens (also on the "Return to call" label). The dark scrim and #fff text are deliberately kept for legibility over arbitrary video; the glyph stays because folds has no fullscreen icon. aria-label/title tooltip already present.	Controls.tsx fullscreen button uses <IconButton variant="Surface" fill="Soft" radii="400" size="400" outlined> with <TooltipProvider>; hardcoded #fff fails on light themes
N58	Screenshare Confirm Popup	CallControls.tsx	303–360	"Share your screen?" popup is a raw <Box> with --bg-surface/--bg-surface-border vars (undefined outside TDS), borderRadius: '0.75rem', boxShadow: '0 8px 32px rgba(...)', no FocusTrap	Cinny's confirmation dialogs use folds <Menu> + <FocusTrap> + <PopOut>; the non-FocusTrap popup is not keyboard-accessible
N59	ML Noise Suppression Panel	General.tsx	1303–1487	Sub-panel uses var(--border-color), var(--bg-card), var(--bg-input) (undefined in folds default theme), raw <details>/<summary> (UA-styled), accentColor: 'var(--accent-orange)' (TDS-only)	All other settings sub-sections use <SettingTile> rows inside <SequenceCard>; no other settings component uses <details>
N60	Knock Badge on Members Button	RoomViewHeader.tsx	744–782	Knock count badge wrapped in extra <div style={{ position: 'relative' }}> with hardcoded fontSize: '9px', minWidth: '14px', height: '14px', padding: '0 3px' overriding folds size="200" — FIXED: removed wrapper div, put position: 'relative' directly on the IconButton, <Badge size="400"> with toRem(3) insets and <Text size="L400"> — now matches the Pinned Messages badge pattern exactly	Pinned Messages badge (same header, lines 651–677) uses position: 'relative' directly on <IconButton> + toRem() for inset; no extra wrapper div
N61	Knock Member Rows	MembersDrawer.tsx	441–487	Knock requester rows use raw <Box> with manually duplicated padding; no <MenuItem> wrapper → no hover/focus/active states — WON'T FIX (deliberate): unlike a MemberItem (a clickable navigation row), a knock row contains two action buttons (Approve / Deny) and is not itself clickable. Wrapping it in <MenuItem> (a <button>) would nest interactive controls inside a button — invalid HTML/ARIA. The row has no interactive state to express.	Every joined/invited member uses <MemberItem> which wraps <MenuItem variant="Background" radii="400"> with baked-in spacing and all interactive states
N62	Unverified Device Banner	RoomInput.tsx	860–883	Warning callout above composer uses inline background: color.Warning.Container, borderLeft: '3px solid color.Warning.Main' — a custom left-border accent pattern not present anywhere else in the folds system — FIXED: replaced the borderLeft: '3px' accent with a standard full border using color.Warning.ContainerLine + config.borderWidth.B300; removed the opacity hacks (folds OnContainer already meets contrast)	Warning indicators in the same codebase use <Chip variant="Warning"> or <Badge variant="Warning">; the 3px left-border card pattern has no folds equivalent
N63	Report Modals — Box Instead of Dialog	ReportRoomModal.tsx / ReportUserModal.tsx	97–110 / 103–116	Both modals render as <Box as="form" role="dialog"> with inline background/borderRadius/boxShadow; use config.radii.R400 (rounder) vs native Dialog which uses R300 — FIXED: both shells are now <Dialog as="form" variant="Surface">; removed inline surface styles (Dialog provides background/radius/shadow)	Native MessageReportItem at Message.tsx:634 and all other Cinny message-action modals use <Dialog variant="Surface">
N64	EditHistoryModal — <Modal> vs <Dialog>	EditHistoryModal.tsx	166	Uses <Modal variant="Surface" size="500"> while sibling message-action modals (DeleteMessageItem:505, MessageReportItem:634) all use <Dialog variant="Surface"> — different widths and internal padding	<Dialog variant="Surface"> is the established modal shell for all message-triggered dialogs
N65	EditHistoryModal — No "Load More"	EditHistoryModal.tsx	253–259	When hasMore is true the modal shows passive <Text>"Showing the 50 most recent edits"</Text> with no action; older edits are inaccessible — FIXED: implemented real pagination — edits accumulate across next_batch fetches (de-duped by event id, re-sorted by ts), with a folds <Button>Load more</Button> (spinner while loading) replacing the passive text	RoomActivityLog.tsx:425 and MessageSearch.tsx:129 both render a folds <Button size="300" variant="Secondary">Load more</Button> to fetch the next page
N66	DateRangeButton — Native <input type="date">	SearchFilters.tsx	558–589	"From" and "To" date fields are raw <input type="date"> with inline style overrides including fontSize: '0.82rem' — FIXED: replaced both with folds <Input type="date" variant="SurfaceVariant" size="300" radii="300">; removed now-unused color import	SelectRoomButton (same file, line 224) and SelectSenderButton (line 424) both use folds <Input size="300" radii="300">; the date inputs are the only native browser inputs in the search filter row
N67	SeasonalEffect / NightLight Z-Index Order	SeasonalEffect.tsx / App.tsx	759 / 62–77	SeasonalEffect mounts at zIndex: 9999; NightLightOverlay at zIndex: 9998. Seasonal particles render above Night Light so they are never tinted. SeasonalEffect also shares z-index: 9999 with the skip-to-content link in ClientLayout.tsx — FIXED: lowered SeasonalEffect overlay to zIndex: 9997 (below Night Light at 9998 and modals at 9999), so Night Light now tints the particles and dialogs are never obscured	Expected UX: Night Light tints all visible content including effects; requires either a higher Night Light z-index or a lower SeasonalEffect z-index
N68	Syntax Highlighting — --lt-accent-* Vars in Non-TDS Themes	syntaxHighlight.ts	313–323	tokenStyle() returns var(--lt-accent-cyan/green/orange/purple, hardcoded-fallback) — --lt-* vars only exist in TDS mode; fallbacks are Monokai dark colors that have poor contrast on light themes and no relationship to the existing --prism-* variables in ReactPrism.css — FIXED: tokenStyle() now maps to the --prism-* family (keyword/selector/boolean/atrule/comment) which has proper light/dark/TDS palettes; comment uses --prism-comment instead of an opacity hack	ReactPrism.css uses --prism-keyword, --prism-selector etc. which switch correctly between light and dark palettes; syntax highlighting should use the same variable family
N69	Mention Highlight — <input type="color"> Instead of HexColorPickerPopOut	General.tsx	644–675	Raw <input type="color"> with hardcoded pixel dimensions; OS-native color picker chrome renders completely differently from the rest of settings UI — FIXED: replaced with <HexColorPickerPopOut> + <HexColorPicker> (react-colorful) behind a folds <Button> trigger showing a color swatch; the picker's built-in onRemove replaces the separate Reset button	PowersEditor.tsx:125–143 establishes <HexColorPickerPopOut picker={<HexColorPicker ...>}> as the codebase's color-picking pattern; Reset button should be <Button size="300" variant="Secondary" radii="300">
N70	ChatBgGrid / SeasonalBgGrid — Raw <button> Elements	General.tsx	1648–1689 / 1711–1742	Both pickers use raw HTML <button> elements with hardcoded width: toRem(76), height: toRem(50/56), borderRadius: toRem(8), border: 2px solid rgba(...) — no focus ring via folds, no variant prop, no hover state from the design system — FIXED: chrome (radius, border, hover, keyboard :focus-visible ring, selected state via data-selected) moved to a shared BgSwatch.css.ts using config/color tokens; only the per-swatch size + live preview background remain inline (these are inherently custom preview tiles, not folds MenuItem/Chip candidates)	Native Cinny theme pickers use folds <MenuItem> or <Chip> which respond to theme and provide focus/hover states automatically

---

🟡 Additional Minor Findings

#	Area	File	Lines	Issue	Native Pattern
N71	Call Prescreen Text	CallView.tsx	63–85	ChannelFullMessage and AlreadyInCallMessage use <Text style={{ color: color.Critical/Warning.Main }}> inline instead of folds <Badge variant="Critical/Warning"> — WON'T FIX (deliberate): these are full, centered explanatory sentences ("Channel Full (N/M) — Wait for someone to leave…"), not short labels. A Badge is for compact chips like "N Live"; wrapping a sentence in one is visually wrong. They already use folds color.* tokens. The sibling LivekitServerMissingMessage/NoPermissionMessage use the same (un-flagged) pattern.	The "N Live" badge directly above (line 127) correctly uses <Badge variant="Critical" fill="Solid" size="400">
N72	Mute MenuItem Icon	RoomNavItem.tsx	454–466	"Mute" <MenuItem> places bell-mute icon as a raw child node instead of using the before prop — FIXED: moved Icons.BellMute to before prop	Every other <MenuItem> in both RoomNavItemMenu and RoomMenu places its leading icon in the before prop
N73	Pending Requests Header	MembersDrawer.tsx	415–422	"Pending Requests" section header is bare <Text> with inline padding instead of className={css.MembersGroupLabel} — FIXED: now uses className={css.MembersGroupLabel} like every other section header	Power-level group labels at lines 506–519 use className={css.MembersGroupLabel} for all other section headers in the same virtualizer list
N74	Emoji Prefix Span	RoomNavItem.tsx	730–736	Emoji prefix rendered as raw <span style={{ fontSize: '1.15em', lineHeight: 1 }}> inside a <Text> node — FIXED: removed the emoji-splitting span; the room name (including any leading emoji) now renders directly inside <Text>	All other nav item text uses folds <Text size="Inherit"> or similar — no raw <span> with em-based font-size override exists elsewhere in the sidebar
N75	Room Name Override / Star Indicators	RoomNavItem.tsx	741–757	Pencil and star indicator icons are embedded inside the name <Box as="span">, giving them the same visual baseline as the room name text — WON'T FIX (deliberate): an inline favorite-star / local-name marker adjacent to the name is a deliberate, common design (cf. Element/Slack pinned-name markers). Moving them to the far right would collide with the unread/notification indicators already there and risks layout regressions. Low value, real regression risk.	Native sidebar status indicators (unread count, notification mode icon) are placed to the far right of the item, never inside the name text span group
N76	Report Modals — Extra Cancel Button	ReportRoomModal.tsx / ReportUserModal.tsx	189–191 / 195–197	Both custom report modals include a "Cancel" <Button> in the footer row — FIXED: removed the Cancel button; dismissal is via the header × / click-outside, matching MessageReportItem	Native MessageReportItem (Message.tsx:675–691) has no Cancel button — dismissal is via × header button or click-outside only
N77	Search Filter Inline Lambdas	SearchFilters.tsx	480, 625	SelectSenderButton and DateRangeButton trigger chips use inline onClick arrow functions — WON'T FIX (deliberate): purely a code-style nit with zero user-facing or behavioural impact. Inline arrow handlers are idiomatic React and used throughout this very file; extracting them yields no functional benefit.	OrderButton (line 58) and SelectRoomButton (line 195) both extract a named const handleOpenMenu: MouseEventHandler<HTMLButtonElement> handler — bypassing the type annotation in the inline form
N78	HasLink Chip Active Color	SearchFilters.tsx	755	HasLink active state uses variant="Primary" (blue); all boolean scope-toggle chips in the same bar use variant="Success" (green) with outlined — FIXED: changed to variant={containsUrl ? 'Success' : 'SurfaceVariant'} outlined={!!containsUrl}	variant="Success" outlined is the established active-state pattern for boolean toggles in the filter bar
N79	Server Notice Chip Radii	RoomViewHeader.tsx	570	<Chip size="400" radii="Pill"> — Pill radii on a room-type label — FIXED: changed to radii="300"	Room/space type labels in lobby (RoomItem.tsx:83, SpaceItem.tsx:63) use radii="300"; radii="Pill" is for filter/tag chips only
N80	Server Support Contact Layout	About.tsx	172–239	Homeserver support contacts rendered as raw <Box direction="Column"> with <Text as="a"> pairs — custom label/link layout — WON'T FIX (deliberate): a contact is role → {matrix_id?, email?, …} (one-to-many links per role), which doesn't map onto SettingTile's single title/description/after slots without contortion. The current layout already uses folds Box/Text/SequenceCard + tokens and Text as="a" (a valid folds pattern); no undefined vars or raw HTML chrome.	All other <SequenceCard> content in About.tsx and General.tsx uses <SettingTile title="..." description="..." after={...}> as the content unit
N81	Background Picker Grid — No Responsive Layout	General.tsx	1707–1742	Fixed width: toRem(76) flex-wrap cells with no minWidth floor or CSS grid auto-fill — SeasonalBgGrid's 13 items produce a visually lopsided orphan last row at any viewport width — FIXED (50076962): both ChatBgGrid and SeasonalBgGrid containers switched to display: grid; grid-template-columns: repeat(auto-fill, minmax(toRem(76), 1fr)), so swatches fill each row evenly	Cinny's native grids use grid-template-columns: repeat(auto-fill, minmax(N, 1fr)) or equivalent for responsive fill
N82	Join/Leave Sounds Auto-Preview	General.tsx	1592–1609	Selecting a sound in the dropdown immediately plays a preview, but no UI affordance communicates this to the user — FIXED: the tile description now reads "…Selecting an option plays a preview." (the same affordance was applied to the new Ringtone selector)	Settings tiles with side effects on selection (theme picker, chat background) show a live visual preview or a dedicated control explaining the side effect

---

Round 3 — Rich Topic Editor, RemindMe Dialog, Composer Toolbar, Voice Recorder, Uploads, Location, Mention Highlight

🔴 Additional Major Findings

N83 — Rich Topic Formatting Toolbar: Raw <button> Elements with Fully Inline Styles

• File: src/app/features/common-settings/general/RoomProfile.tsx, lines 335–358
• Status: FIXED — replaced raw <button> elements with <Button size="300" radii="300" variant="Secondary" fill="Soft"> with styled <Text> children for B/I/S/code labels
• Issue: The four formatting buttons (B, I, S, `) in the room topic editor are plain HTML <button> elements with entirely inline styles: manual border, borderRadius, background, color, cursor, fontSize, fontWeight, fontStyle, fontFamily, lineHeight. They bypass the folds design token system completely — no variant, size, or radii props, no theme-reactive hover/focus states.
• Root Cause: Custom addition without referencing folds primitives.
• Fix: Replace with <IconButton type="button" size="300" radii="300" variant="Surface" fill="Soft"> matching the emoji-picker trigger immediately above them at line 285, which already uses the correct pattern.

N84 — Topic Preview in Room Settings Renders Plain Text Instead of formatted_body

• File: src/app/features/common-settings/general/RoomProfile.tsx, lines 457–461
• Status: FIXED — read-mode topic now checks topic.format === 'org.matrix.custom.html' and renders parse(sanitizeCustomHtml(topic.formatted_body)), matching RoomTopicViewer and all other display sites
• Issue: The read-mode topic display wraps topic.topic (the plain-text field) in <Linkify> and never reads formatted_body. However buildTopicContent() (lines 82–89) intentionally stores both topic and formatted_body under org.matrix.custom.html. After the user saves a formatted topic, the preview panel immediately shows the stripped plain-text version — the formatting appears to disappear within the same settings panel.
• Root Cause: The existing RoomTopicViewer component (src/app/components/room-topic-viewer/RoomTopicViewer.tsx:24–51) already checks topic.format === 'org.matrix.custom.html' and pipes formatted_body through sanitizeCustomHtml. This component is used everywhere else (RoomIntro, LobbyHero, RoomItem, Invites, etc.) but not in Room Settings.
• Fix: Replace the inline plain-text render with <RoomTopicViewer topic={roomTopic}> to match all other display sites.

---

🟠 Additional Moderate Findings

#	Area	File	Lines	Issue	Native Pattern
N85	RemindMe Dialog Shell	RemindMeDialog.tsx	69–81	Dialog shell is <Box role="dialog"> with background, borderRadius, boxShadow, overflow all set as inline styles using token lookups. Corner radius is config.radii.R400 which differs from the R300 embedded in <Dialog variant="Surface"> — FIXED: shell replaced with <Dialog variant="Surface" style={modalStyle}>; removed the inline background/borderRadius/boxShadow/overflow and the now-unused color import	All small message-action dialogs (LeaveRoomPrompt, LogoutDialog, JoinAddressPrompt, PowerChip, DeleteMessageItem) use <Dialog variant="Surface" style={modalStyle}> as the shell
N86	RemindMe Preset Buttons	RemindMeDialog.tsx	111–117	The four preset time choices (20 min, 1 hr, 3 hr, tomorrow) use <MenuItem size="300" radii="300"> — MenuItem is a navigation primitive tied to menu/menubar ARIA roles; placing it inside role="dialog" is an invalid ARIA combination — FIXED: each preset is now a folds <Button variant="Secondary" fill="Soft" radii="300">, resolving the invalid menuitem-in-dialog ARIA	Dialog action choices use <Button> (delete/leave/logout dialogs) or <Chip> (selection choices). No other dialog in the codebase uses MenuItem for action items
N87	Composer Toolbar Toggle Pattern	General.tsx	1100–1114	Per-button toolbar toggles (Format, Emoji, Sticker, GIF, Location, Poll, Voice, Schedule) use <Chip variant="Primary"/"Secondary" radii="Pill"> in a wrap grid — a compact chip-toggle grid inside a SettingTile, different from every adjacent row	The three sibling tiles in the same Editor() function (ENTER for Newline, Markdown, Formatting Toolbar) all use <SettingTile after={<Switch variant="Primary">}>. 15+ other binary settings in the file use the Switch pattern
N88	Voice Recorder Recording State	VoiceMessageRecorder.tsx	195, 206, 240, 276	Recording container background is var(--bg-surface-variant), the live pulse dot is var(--tc-danger-normal), waveform bars are var(--tc-primary-normal) — custom Lotus CSS vars that may not exist in folds themes, falling back to transparent/black — FIXED: replaced with color.SurfaceVariant.Container, color.Critical.Main, color.Primary.Main	Native message components use JS-accessible color.* tokens that are always populated regardless of theme class
N89	Voice Recorder Preview Audio	VoiceMessageRecorder.tsx	282–283	Preview state renders bare <audio src={previewUrl} controls> — native browser element with inconsistent cross-browser chrome — FIXED: replaced with <audio ref> + folds <IconButton> play/pause toggle; onEnded resets playing state	Native audio messages use folds Attachment/AttachmentContent layout wrappers; pre-send preview should use <IconButton> play/pause controls
N90	Mention Highlight Contrast Formula	App.tsx	36–40	Auto-computed text color (black/white) uses simplified luma (0.299r + 0.587g + 0.114b)/255 > 0.5 — not WCAG 2.1 relative luminance (which requires gamma linearization) — FIXED: replaced with WCAG 2.1 relative luminance formula using ((c+0.055)/1.055)^2.4 gamma linearization; threshold moved from 0.5 to 0.179	Folds color.*.OnContainer tokens are manually curated to pass WCAG AA 4.5:1 contrast ratios; custom computation must match this guarantee

---

🟡 Additional Minor Findings

#	Area	File	Lines	Issue	Native Pattern
N91	Upload Card Caption Input	UploadCardRenderer.tsx	356–376	Caption input is raw <input type="text"> with hardcoded inline CSS using Lotus-specific vars not in folds — FIXED: replaced with folds <Input variant="Secondary" size="300" radii="300">	Other text inputs in the UI use folds <Input size="300" radii="300"> with folds-token props for all sizing and color
N92	Location "Open Location" Button	MsgTypeRenderers.tsx	534–547	"Open Location" action link uses <Chip as="a"> — compact badge-sized element — FIXED: replaced with <Button as="a" variant="Secondary" fill="Solid" radii="300" size="400"> matching FileContent pattern	FileContent.tsx uses <Button variant="Secondary" fill="Solid" radii="300" size="400"> for "Open File"/"Open PDF"
N93	Location Coordinates Text	MsgTypeRenderers.tsx	532	<Text size="T300" style={{ opacity: 0.65 }}> — hardcoded non-standard opacity — FIXED: replaced with <Text size="T300" priority="300">	Secondary text uses folds priority prop; 0.65 is outside the token scale
N94	Mention Highlight Border Invisible	App.tsx	41	--mention-highlight-border is set to the same value as --mention-highlight-bg — the border is invisible — FIXED: border is now rgba(r,g,b,0.5) — same hue as the background at 50% opacity, always visible	In folds, color.*.ContainerLine is always a lighter/muted sibling of color.*.Container, providing the 1px outline that gives mention chips visual definition

---

🔴 Additional Major Findings (Gemini)

N95 — AFK Auto-Mute Keeps Hardware Mic Active While Muted

• File: src/app/hooks/useAfkAutoMute.ts
• Status: OPEN [Gemini_Found]
• Issue: The useAfkAutoMute hook holds a persistent MediaStream from getUserMedia for the duration of the call. This causes the OS-level microphone recording indicator (e.g., green dot on macOS/iOS or camera/mic icon on Windows) to stay on even when the user mutes their microphone within the Lotus Chat UI.
• Root Cause: A separate parallel MediaStream is spawned instead of tapping into LiveKit/Element Call's managed local stream.
• Fix: Stop the MediaStream tracks (.getTracks().forEach(t => t.stop())) when callEmbed.control.microphone is false, and re-request getUserMedia when it turns back on. Suspending the AudioContext alone is not sufficient — it stops processing but does not clear the OS recording indicator; only stopping the tracks does. Optionally suspend the AudioContext alongside the track stop for CPU savings. Note: re-requesting getUserMedia on unmute adds a small latency and may trigger browser permission prompts on some configurations. Tapping into Element Call's local audio stream directly is architecturally cleaner but is not possible from Lotus — EC runs in a cross-origin iframe and its LiveKit LocalAudioTrack is inaccessible from our realm.

N96 — Call Recovery "Retry" and "Leave" Buttons Perform Identical Actions

• File: src/app/features/call/CallView.tsx (CallLoadErrorMessage)
• Status: FIXED ⚠️ UNTESTED [Gemini_Found] — needs verification: force a call load failure (offline the network right as you click join, or block the EC origin), confirm the error overlay shows a single "Back" button that returns to the prescreen cleanly.
• Issue: The Retry and Leave buttons in the call error overlay both executed the exact same dismiss function (setCallEmbed(undefined)), returning the user to the prescreen. "Retry" falsely implied it would automatically re-attempt joining the call. A true retry would require threading the previous CallPreferences into this component (via props or a Jotai atom) — a non-trivial change.
• Root Cause: Two identically-wired buttons with misleading labels; the simpler recovery path is a single honest label.
• Fix Applied: Removed the "Retry" button. Renamed "Leave" → "Back". One button, one clear action: returns to the prescreen where the user can manually click Join again to retry. Updated the code comment to match.

---

📱 PWA, Service Worker & Notifications Audit (Wave 2)

Scope: src/sw.ts, src/app/pages/client/ClientNonUIFeatures.tsx, vite.config.js, public/manifest.json, src/app/utils/callSounds.ts, src/app/hooks/useCallJoinLeaveSounds.ts. Numbers N105–N109. Items already open (asset caching, manifest: false, new Notification() vs showNotification()) are NOT re-listed.

---

N105 — Missing SW notificationclick handler: notification clicks broken when tab is closed

• File: src/sw.ts (handler entirely absent); src/app/pages/client/ClientNonUIFeatures.tsx, lines 151–155 (InviteNotifications) and 277–284 (MessageNotifications)
• Status: OPEN [Claude_Found]
• Issue: All notification click handling is wired via noti.onclick in the main thread (noti.onclick = () => { navigate(...); noti.close(); }). This callback only fires while the originating tab is open and its JavaScript is running. When the browser has no open tabs for the app (or the tab is suspended/backgrounded), clicking an OS notification does nothing — there is no SW notificationclick handler to focus an existing window or open a new one and navigate to the correct room.
• Root Cause: Notifications were built entirely in the main thread without a corresponding SW notificationclick event listener. The SW is registered and active but has zero notification-lifecycle handlers.
• Fix: Add a notificationclick handler to src/sw.ts that calls event.waitUntil(clients.matchAll({ type: 'window', includeUncontrolled: true }).then(list => { const win = list[0]; if (win) return win.focus(); return clients.openWindow(event.notification.data?.url ?? '/'); })). Pass the target room URL via data: { url: roomPath } in the Notification constructor so the SW can navigate correctly.

---

N106 — Decrypted E2EE message plaintext leaked to OS notification center

• File: src/app/pages/client/ClientNonUIFeatures.tsx, line 343
• Status: OPEN [Claude_Found]
• Issue: The MessageNotifications component passes mEvent.getContent().body directly as the notification body: body: (mEvent.getContent().body as string | undefined) ?? ''. By the time RoomEvent.Timeline fires, matrix-js-sdk has already decrypted the event in memory. The fully decrypted plaintext is then handed to new window.Notification(), which stores it in the OS notification center. This plaintext is visible on the device lock screen (if notification previews are enabled), in the OS notification history, and may be read by any app with READ_NOTIFICATIONS permission (e.g., accessibility services, backup apps) — even when the room uses end-to-end encryption. The 120-character slice (slice(0, 120)) does not mitigate this.
• Root Cause: No distinction is made between encrypted and unencrypted rooms when constructing notification bodies. There is no check such as mEvent.isEncrypted() or room.hasEncryptionStateEvent() that would substitute a generic body.
• Fix: Check whether the room is encrypted before populating the body. For encrypted rooms, use a generic string (e.g., "New encrypted message") as the body instead of the decrypted content. If message previews in notifications are intentionally desired by the user, gate them behind an explicit opt-in setting that warns about OS-level plaintext exposure.

---

N107 — SW has no push event handler: Web Push delivery is completely broken

• File: src/sw.ts (handler entirely absent)
• Status: OPEN [Claude_Found]
• Issue: The service worker never registers a push event listener. If a Matrix push gateway (e.g., Sygnal) is ever configured and sends a Web Push notification, the SW silently discards the push event — no notification is shown, no in-app routing occurs. The absence of a push handler means the entire background-notification path (i.e., notifications when no tab is open) is non-functional, which is one of the primary requirements for a PWA.
• Root Cause: The SW was written exclusively to proxy authenticated Matrix media requests. No background notification plumbing was ever added.
• Fix: Add a push event listener to src/sw.ts that reads the push payload (event.data.json()), then calls self.registration.showNotification(title, { body, data: { url } }). Pair with the notificationclick fix from N105. On the app-registration side, wire PushManager.subscribe() to a Matrix push gateway so the server can actually deliver pushes.

---

N108 — No maskable icon in PWA manifest: Android adaptive icons display incorrectly

• File: public/manifest.json, lines 12–57
• Status: OPEN [Claude_Found]
• Issue: The manifest lists nine android-chrome-*.png icons (36 × 36 through 512 × 512) but none include "purpose": "maskable". Android 8+ adaptive icons apply a platform-defined shape mask (circle, squircle, teardrop, etc.) to PWA home-screen icons. Without a maskable-purpose icon, the OS either adds a white square background to prevent clipping or applies the mask directly to the regular icon, typically cropping the Lotus logo in a visually incorrect way.
• Root Cause: Icons were added from a standard Android icon set without adding a maskable variant. The "purpose" field defaults to "any", which tells the OS the icon is not designed for safe-area masking.
• Fix: Create a variant of the Lotus icon with sufficient padding (at least 10% safe zone on all sides so the center artwork survives any clip shape) and add it as a separate manifest entry with "purpose": "maskable", e.g.: { "src": "./res/android/android-chrome-512x512-maskable.png", "sizes": "512x512", "type": "image/png", "purpose": "maskable" }. One maskable icon at 512 × 512 is sufficient; keep the existing "any" entries.

---

N109 — Authenticated media URLs passed to Notification icon/badge: OS cannot fetch them (produces 401)

• File: src/app/pages/client/ClientNonUIFeatures.tsx, lines 333–339 and 270–273
• Status: OPEN [Claude_Found]
• Issue: When the homeserver requires authenticated media (Matrix spec v1.11+, path /_matrix/client/v1/media/download/...), mxcUrlToHttp(mx, avatarMxc, useAuthentication, 96, 96, 'crop') returns an authenticated URL. That URL is then passed directly as icon and badge to new window.Notification(). The OS/browser notification subsystem fetches icon and badge URLs directly — outside the page's JavaScript context — so the service worker's fetch handler never fires for them (the SW only intercepts fetches with a valid event.clientId, which these OS-initiated fetches lack). The homeserver returns HTTP 401, and the notification shows no icon or badge.
• Root Cause: The SW auth-header injection is designed for page-initiated /_matrix/client/v1/media/ fetches. It does not (and cannot) intercept fetches made by the OS notification subsystem. Room avatar URLs are passed to Notification without first converting them to an auth-agnostic form.
• Fix: Before creating a Notification, fetch the avatar URL in-page (via the existing authenticated fetch path where the SW can inject headers), convert the response to a Blob URL (URL.createObjectURL(blob)), and pass the Blob URL as icon/badge. Alternatively, skip the avatar for notifications entirely and use the static app logo (already done for invite notifications via LogoSVG) to avoid the authenticated-media complexity.

🌸 Lotus Feature Internals Audit (Wave 2)

Deep audit of Lotus-specific hook internals, build scripts, and the avatar-decoration pipeline. All findings below are [Claude_Found].

---

N113 — addReminder/removeReminder Read-Modify-Write Race Condition

• File: src/app/hooks/useReminders.ts, lines 52–68
• Status: OPEN [Claude_Found]
• Issue: Both addReminder and removeReminder call readReminders(mx) — a synchronous read from the Matrix client's local account-data cache — and then fire setAccountData asynchronously. If two calls overlap before either write has committed and the local cache updated (e.g. a user quickly adds two reminders, or adds one while a removal is in flight), both calls read the same stale baseline and the second write silently overwrites the first. Example: adding R1 and R2 in quick succession → both calls read [], write [R1] and [R2] respectively → only R2 survives, R1 is lost.
• Root Cause: No optimistic locking, no serial queue, and the read source (mx.getAccountData()) does not reflect uncommitted in-flight writes.
• Fix: Use the React reminders state (passed as a parameter or captured in a useRef) as the source of truth for mutations instead of re-reading from the client cache. Alternatively, serialize writes through a promise queue so each addReminder/removeReminder awaits the previous setAccountData before computing the next state.

---

N114 — ReminderMonitor Calls removeReminder Fire-and-Forget; Network Failure Silently Drops the Reminder

• File: src/app/pages/client/ClientNonUIFeatures.tsx, lines 399, 413–414
• Status: OPEN [Claude_Found]
• Issue: Inside ReminderMonitor.check(), when a reminder fires the code immediately does firedRef.current.add(key) and then calls removeReminder(r.eventId, r.timestamp) without await and without a .catch() handler. If removeReminder fails (network error, 429 rate-limit, homeserver down), the reminder remains in account data but is permanently blocked from re-firing this session because its key is already in firedRef. The user's reminder is silently swallowed for the rest of the session; only a full page reload recovers it.
• Root Cause: The promise returned by removeReminder is discarded. There is no error path that rolls back firedRef.current or reschedules the reminder for retry.
• Fix: Make check an async function (or add a .catch() on the call), and only add to firedRef after removeReminder succeeds. On failure, omit the firedRef add so the reminder retries on the next poll tick.

---

N115 — ReminderMonitor 30 s Poll Interval Is Reset on Every reminders State Change, Delaying Near-Due Reminders

• File: src/app/pages/client/ClientNonUIFeatures.tsx, lines 394–428
• Status: OPEN [Claude_Found]
• Issue: reminders is listed in the useEffect dependency array (}, [mx, reminders, setToast, removeReminder, mDirects]). Every time a reminder is added, removed, or synced back from the server, React tears down the effect (clearing setInterval) and re-creates it, resetting the 30 s countdown from zero. A reminder due 1 s from now will not fire for up to 30 s if a reminder state change occurs 0.5 s before the due time — for instance, when the server's account-data echo arrives and updates reminders. In the worst case, rapid add/remove cycles can continuously defer the poll indefinitely (as long as new mutations keep arriving faster than 30 s).
• Root Cause: check() closes over reminders, requiring it as a dependency; but the interval itself does not need to be recreated on every reminder change — only the closure does.
• Fix: Store the latest reminders value in a useRef updated on each render, and read from the ref inside check(). Remove reminders from the useEffect dependency array. The interval is then created once per mx/handler change, and check() always sees the current snapshot via the ref.

---

N116 — useCallSpeakers Speaker Set Rebuilt From Mutation Batch Only — All Other Speaking Participants Are Dropped

• File: src/app/hooks/useCallSpeakers.ts, lines 20–44
• Status: OPEN [Claude_Found]
• Issue: The MutationObserver callback builds a fresh Set<string> from only the tiles present in the current mutation batch, then calls setSpeakers(s). If participant A has been speaking for 10 s but their tile has not mutated recently, and participant B's tile mutates for an unrelated reason (e.g. a class change), the batch contains only B's tile. Even if B is not speaking, s is empty and setSpeakers(s) replaces the entire state — A disappears from the speakers set despite still speaking. The result is a constantly-flickering or always-empty speakers indicator.
• Root Cause: Speaker state is derived from the delta (mutation batch) rather than the full current DOM state. Compare with useRemoteAllMuted.syncState() in the same file, which correctly re-scans all [data-muted] elements on every mutation rather than looking only at the mutated ones.
• Fix: Replace the per-batch iteration with a full re-scan of all observed tiles on each callback: iterate all elements in videoContainers, check each for the ::before speaking indicator, and build the new Set from currently-speaking tiles — not just the mutated ones.

---

N117 — useCallSpeakers Static querySelectorAll NodeList Misses Video Tiles Added to EC DOM Mid-Call

• File: src/app/hooks/useCallSpeakers.ts, lines 14–17
• Status: OPEN [Claude_Found]
• Issue: callEmbed.document?.querySelectorAll('[data-video-fit]') returns a static NodeList snapshot at the instant the useMemo evaluates. When a new participant joins mid-call and EC renders their video tile, that tile is not in the captured list. No MutationObserver is ever attached to the new tile, so the new participant can never be detected as a speaker for the remainder of the call. callMembers is a memo dependency and does update on join/leave, but there is a timing gap: callMembers may change before EC has finished rendering the new tile inside the iframe, so querySelectorAll at that moment still does not find the new tile.
• Root Cause: Observing a static snapshot of tiles does not compose with EC's dynamically-updating DOM. useRemoteAllMuted avoids this entirely by watching doc.body with { subtree: true, childList: true }, which automatically picks up new tiles without re-querying.
• Fix: Replace the static-NodeList + per-tile-observer approach with a single body-level observer (same as useRemoteAllMuted), and re-scan all [data-video-fit] tiles on each relevant mutation.

---

N118 — useCallSpeakers Relies on Three Layers of Undocumented EC Internal APIs

• File: src/app/hooks/useCallSpeakers.ts, lines 15, 28–35
• Status: OPEN [Claude_Found]
• Issue: Speaker detection depends on three private Element Call implementation details that are not part of any stable EC API contract and can silently break on any EC version bump:
  1. [data-video-fit] — selector for video tile wrapper elements (internal EC data attribute).
  2. getComputedStyle(el, '::before').getPropertyValue('background-image') !== 'none' — speaking state is inferred from a ::before pseudo-element's background-image. Any EC refactor of the speaking indicator (e.g. switching to a CSS class, data-speaking attribute, or canvas overlay) silently breaks detection with no error.
  3. el.querySelector('[aria-label]')?.getAttribute('aria-label') — assumes the first child with an aria-label carries the Matrix user ID; EC could equally label that element with a display name or a button description. When these internals change, speakers silently stays empty with no runtime error.
• Root Cause: There is no stable programmatic API exposed by the EC iframe for speaker state; the implementation reverse-engineers EC's internal DOM/CSS.
• Fix: Prefer EC's postMessage protocol if it exposes speaker events. At minimum, add a build-time assertion that pins the EC package version this mechanism was validated against (e.g. in lotusDenoise or a separate CI check), and file an upstream EC issue requesting a stable data-speaking attribute — which would match the pattern already used by [data-muted] in useRemoteAllMuted.

---

N119 — syncDecorations.mjs Treats Network Errors the Same as 404 — CDN Outage Silently Wipes Entire Catalog

• File: scripts/syncDecorations.mjs, lines 39–46, 56–65
• Status: OPEN [Claude_Found]
• Issue: headCheck catches all fetch exceptions (DNS failure, timeout, CORS error, TLS failure) and returns { ok: false, status: 0 }. This is structurally identical to an HTTP 404 ({ ok: false, status: 404 }). The script classifies all non-ok results as "missing" and removes them from avatarDecorations.ts. If drive.lotusguild.org is temporarily unreachable when a developer runs npm run sync:decorations, every single decoration fails the HEAD check with status: 0, is marked missing, and is removed. The script writes an empty avatarDecorations.ts, logs "Done. Removed N entries from the catalog.", and exits 0 — permanently destroying the catalog in source control with no warning.
• Root Cause: The catch block does not distinguish transient network failures from confirmed HTTP 404 responses.
• Fix: Return a distinct value for network errors (e.g. { slug, ok: false, status: 0, networkError: true }). Before writing the updated catalog, abort with process.exit(1) if any result has networkError: true — the CDN may be unreachable and removing all entries would be data loss. Only entries with a confirmed status: 404 (file genuinely absent from the CDN) should be removed.

---

N120 — CDN URL Hard-Coded Separately in syncDecorations.mjs and avatarDecorations.ts — Can Drift

• File: scripts/syncDecorations.mjs, line 24; src/app/features/lotus/avatarDecorations.ts, lines 1–2
• Status: OPEN [Claude_Found]
• Issue: The Nextcloud CDN base URL (including the embedded share token bHswJ9pNKp2t26N) is defined twice: as const CDN in the sync script and as export const DECORATION_CDN in the runtime catalog. If the CDN is migrated (new provider, new Nextcloud share, rotated token), a developer must update both files. Missing one means the sync script probes the old URL while the runtime client fetches from the new one (or vice versa), silently producing a catalog that references unreachable assets. There is no test or lint check that enforces parity.
• Root Cause: syncDecorations.mjs is a plain .mjs script that cannot directly import from a .ts source file at runtime, so the constant was copied instead of shared.
• Fix: Extract the CDN URL into a shared .mjs config file (e.g. scripts/decorationConfig.mjs) that syncDecorations.mjs imports directly. Have avatarDecorations.ts read the same value at build time (via a Vite define/import, or by making the script write the constant into avatarDecorations.ts rather than hardcoding it). Alternatively, add a CI step that greps both files and fails if the URLs differ.

---

N128 — patch-folds.mjs Emits console.warn Instead of process.exit(1) When Patch Target Is Not Found

• File: scripts/patch-folds.mjs, lines 21–23
• Status: OPEN [Claude_Found]
• Issue: When the target string children: src(filled) is not found in node_modules/folds/dist/index.js — because folds shipped an update that renamed or restructured this code path — the script logs Warning: folds Icon patch target not found - may need updating. and exits with code 0. The postinstall npm hook considers the install successful. The production build then ships the unpatched folds, where passing a non-function as src to <Icon> causes a runtime TypeError: src is not a function at any call site that relies on the guard. The failure is invisible at build and install time; it manifests only when the affected UI is rendered in production.
• Root Cause: The mismatch branch uses console.warn (exit 0) rather than process.exit(1), treating a broken build pre-requisite as a non-fatal advisory.
• Fix: Replace the console.warn(...) + implicit exit-0 with console.error(...) followed by process.exit(1). This causes npm install (and CI) to fail loudly, forcing the developer to update the patch target string before the build can proceed. The "already applied" branch (line 15) correctly exits 0 and does not need to change.

---

🔐 Security & Data Persistence Audit (Wave 2)

Deep audit of five files: src/app/state/sessions.ts, src/client/initMatrix.ts, src/app/pages/client/ClientRoot.tsx, src/app/state/settings.ts, src/app/utils/sanitize.ts. Findings N97–N100. Items already tracked elsewhere in this file are noted as FALSE POSITIVEs below.

---

N97 — setFallbackSession() stores the full Matrix access token in plaintext localStorage with zero mitigations

• File: src/app/state/sessions.ts, lines 32–68
• Status: OPEN [Claude_Found]
• Issue: setFallbackSession() persists four credentials to plaintext localStorage under fixed, predictable keys with no encryption, no httpOnly-cookie alternative, and no sessionStorage (which would at least not survive a browser restart). The four keys and their threat value:
  • cinny_access_token — the raw Matrix Bearer token; sufficient alone to fully impersonate the user with the homeserver: send/read messages, download E2E media, change account settings, join/leave rooms
  • cinny_device_id — the E2E device identifier; lets an attacker narrow the cross-signing key set needed to read encrypted history
  • cinny_user_id — the Matrix ID (@user:server)
  • cinny_hs_base_url — homeserver origin Any XSS payload executing in this origin can exfiltrate all four with four localStorage.getItem() calls. There is no Content-Security-Policy in the nginx/Caddy config files (existing open finding) that would limit script injection. getFallbackSession() (lines 49–68) also re-reads all four keys from localStorage on every boot — there is no in-memory cache that would allow the token to be removed from storage after the first load, so the credential window is permanent until logout. Additionally, setFallbackSession() performs four sequential, non-atomic localStorage.setItem() calls (lines 38–41). If the process is killed or the browser crashes between calls 1 and 3, cinny_access_token will be written to storage but the session will be incomplete; getFallbackSession() will return undefined (requires all four keys), leaving a stranded, fully-valid access token in localStorage that is never used or cleaned up.
• Root Cause: The original multi-account Cinny path (now commented out) used an atomWithLocalStorage abstraction layer. The current single-account "fallback" path bypasses all abstraction and writes directly to raw localStorage with no protection.
• Fix: Replace the four setItem calls with a single atomic write: serialize all four fields as one JSON object under a single key (cinny_session). This eliminates the partial-write window. For the XSS-resistance problem: migrate the access token to sessionStorage as a minimum (does not survive browser restart, limiting the exposure window on shared devices). For stronger protection: derive a per-device encryption key via crypto.subtle.generateKey and store it in IndexedDB (which already holds E2E keys via IndexedDBCryptoStore); encrypt the access token before writing to localStorage. The OIDC token-rotation flow (short-lived access tokens, refresh-token-only persistence) is the architecturally cleanest long-term fix.

---

N98 — Normal logout (logoutClient / handleLogout) calls window.localStorage.clear(), permanently wiping user preferences and unsent drafts

• File: src/client/initMatrix.ts, line 78 (logoutClient); src/app/pages/client/ClientRoot.tsx, line 133 (handleLogout inside useLogoutListener)
• Status: OPEN [Claude_Found]
• Issue: Both logout code paths call window.localStorage.clear(), which removes every key for the origin — not just the session credentials. Keys destroyed on every normal logout include:
  • settings — theme, notification preferences, keyboard shortcuts (pttKey, deafenKey), toolbar configuration, noise-suppression mode, accessibility settings, and all other Settings interface fields
  • draft-msg-{roomId} (one key per room) — unsent composer drafts for every room the user had open at logout time
  • pip-position — saved PiP window position
  • status_msg_{userId} / status_expiry_{userId} — persisted presence status message and auto-clear timestamp
  • afterLoginRedirectPath — post-login redirect A user who logs out and back in on the same device starts with a factory-reset app. This violates the standard expectation that app preferences persist across sessions (every comparable Matrix client and messaging app preserves preferences across logout). The clearLoginData() function (the explicit "wipe all data" reset path, surfaced in the UI as "Clear local data and reload") also calls localStorage.clear() — that usage is appropriate and expected — but logoutClient() / handleLogout should not share this behavior.
• Root Cause: localStorage.clear() was chosen as a one-line logout implementation rather than selectively removing only the four session credential keys. No distinction is made between "end the session" and "factory reset."
• Fix: Replace window.localStorage.clear() in both logoutClient (line 78) and handleLogout (line 133) with targeted removal of only the session credential keys:

  ['cinny_access_token', 'cinny_device_id', 'cinny_user_id', 'cinny_hs_base_url'].forEach(k =>
    window.localStorage.removeItem(k)
  );
  

  Leave settings, draft keys, and all other preference keys intact. Reserve window.localStorage.clear() for the clearLoginData() path only.

---

N99 — useSyncState callback in ClientRoot.tsx only handles PREPARED; a sync ERROR before first sync completion freezes the app on the loading screen with contradictory UI

• File: src/app/pages/client/ClientRoot.tsx, lines 179–186; src/app/hooks/useSyncState.ts, lines 1–14
• Status: OPEN [Claude_Found]
• Issue: The useSyncState callback in ClientRoot only calls setLoading(false) for state === 'PREPARED'. The Matrix JS SDK can emit SyncState.Error before ever reaching PREPARED — for example when the device is offline at startup, the homeserver is unreachable, or the first /sync request returns a non-retryable server error. When this happens:
  1. loading remains true (never set to false)
  2. <ClientRootLoading /> renders indefinitely, showing the "Heating up" spinner
  3. <SyncStatus mx={mx} /> — rendered unconditionally above the loading conditional at line 191 — fires its own useSyncState listener and shows a "Connection Lost!" red banner simultaneously
  4. The user sees contradictory messages ("Connection Lost!" + "Heating up") with no recovery action visible from the loading screen. The only escape is the ClientRootOptions ⋮ menu (lines 192–125), which is a small icon button with Logout / Clear Cache — not discoverable without prior knowledge. Note: This is distinct from the existing race-condition finding (which concerns the listener missing PREPARED because it registers too late). Here the listener registers correctly and fires, but it fires with ERROR instead of PREPARED, and the callback ignores it.
• Root Cause: The useSyncState callback is designed around a single happy-path terminal state (PREPARED). SyncStatus handles error states for the post-PREPARED reconnection UX, but does not replace the loading screen.
• Fix: Extend the useSyncState callback to handle SyncState.Error and SyncState.Stopped by setting a separate syncError state, then render a dedicated error splash (parallel to the existing loadState/startState error dialog at lines 193–238) that shows a descriptive message and a Retry button that calls startMatrix(mx):

  useSyncState(mx, useCallback((state) => {
    if (state === 'PREPARED') setLoading(false);
    else if (state === 'ERROR' || state === 'STOPPED') setSyncError(true);
  }, []));
  

---

N100 — sanitize.ts allows unrestricted CSS class names on <pre> elements; allowedClasses not configured for pre

• File: src/app/utils/sanitize.ts, lines 69 and 156–163
• Status: OPEN [Claude_Found]
• Issue: permittedTagToAttributes includes pre: ['data-md', 'class'] (line 69), permitting the class attribute on <pre> elements in Matrix formatted_body messages. However, allowedClasses (lines 156–163) restricts class names only for code elements (language-* patterns for Prism syntax highlighting). Per sanitize-html documentation: when class is listed in allowedAttributes for a tag but that tag has no entry in allowedClasses, all class names are permitted on that element. This allows a remote message sender to inject arbitrary class names onto <pre> blocks — e.g. <pre class="some-cinny-class admin-notice"> — which could activate site-specific or folds-generated CSS rules keyed to those class names, override visual styling, or trigger ::before/::after pseudo-element content defined in any loaded stylesheet. By contrast, the code element (which is typically the inner child of <pre>) is correctly restricted to language-* only, making the pre oversight inconsistent.
• Root Cause: When Prism syntax-highlighting class support was added for <code>, the <pre> element was given a class passthrough (to allow <pre class="language-python"> wrappers) but no corresponding allowedClasses whitelist entry was added for it.
• Fix: Add pre to allowedClasses with the same language-* pattern already used for code:

  allowedClasses: {
    code: ['language-*'],
    pre:  ['language-*'],
  },
  

---

Wave 2 Security Audit — FALSE POSITIVES (re-examined, correctly handled)

• setMaxListeners(150) in initMatrix.ts — already tracked as OPEN in the Infrastructure table above. Not duplicated here.
• useSyncState PREPARED race condition — already tracked as OPEN in the Architectural Resilience table. N99 above is the distinct ERROR-before-PREPARED case, not a duplicate of the existing race-condition entry.
• pushSessionToSW() called without await in logoutClient() — pushSessionToSW is synchronous; postMessage is fire-and-forget by design and requires no await. FALSE POSITIVE.
• mx.initRustCrypto() uncaught rejection in initMatrix.ts line 48 — the rejection propagates out of the async initClient() function and is caught by useAsyncCallback in ClientRoot.tsx, surfaced as loadState.status === AsyncStatus.Error with an error dialog and Retry button. FALSE POSITIVE.
• style attribute on <font> and <span> in sanitize.ts — transformFontTag and transformSpanTag overwrite style entirely: the spread ...attribs is followed by an explicit style: key that replaces any attacker-supplied value with a computed-safe string derived from regex-validated data-mx-color/data-mx-bg-color only. allowedStyles then further validates the result. FALSE POSITIVE.
• href allowing javascript: URLs — allowedSchemes: ['https', 'http', 'ftp', 'mailto', 'magnet'] plus allowProtocolRelative: false and allowedSchemesAppliedToAttributes: ['href'] correctly block javascript:. FALSE POSITIVE.
• <img src="..."> without scheme checking — transformImgTag converts all non-mxc:// src values to <a href="...">, at which point the href is scheme-checked; javascript: and data: are both rejected. mxc:// images are correctly passed through. FALSE POSITIVE.
• mentionHighlightColor missing whitelist in getSettings() — the value is consumed only via document.documentElement.style.setProperty() (CSS custom property), which cannot execute JavaScript regardless of value. FALSE POSITIVE.
• dangerouslySetInnerHTML / innerHTML XSS chain via data-mx-maths — a full codebase grep confirms zero uses of dangerouslySetInnerHTML or direct innerHTML assignment in src/app/. Sanitized HTML is rendered via html-react-parser's parse(), which produces React elements via createElement, not raw HTML injection. FALSE POSITIVE.
• removeFallbackSession() key-ordering issue — removeFallbackSession is dead code in all active paths; it is only referenced in the commented-out multi-account migration block within sessions.ts itself. Active logout goes through window.localStorage.clear(). FALSE POSITIVE for the ordering concern; the broader localStorage.clear() behavior is tracked in N98.
• Settings atom contains sensitive data — the Settings interface stores only UI preferences (theme, notification flags, keyboard shortcuts, toolbar config). No access tokens, cryptographic keys, or private message content are stored in the settings localStorage key. FALSE POSITIVE.

---

📞 Call System & Noise Suppression Audit (Wave 2)

Scope: src/app/plugins/call/CallControl.ts, src/app/plugins/call/CallEmbed.ts, src/app/hooks/useCallSpeakers.ts, src/app/components/CallEmbedProvider.tsx, build/lotus-denoise.js, vite.config.js. Numbers N122–N127. N116–N118 already document useCallSpeakers speaker-detection fragility; findings below cover distinct issues not captured there.

---

N122 — setMediaState promise hangs permanently when EC omits a DeviceMute state-echo

• File: src/app/plugins/call/CallControl.ts, lines 185–193
• Status: OPEN [Claude_Found]
• Issue: The Promise returned by setMediaState can never resolve if EC does not emit a DeviceMute fromWidget state-update event in response to the host's mute command. After await this.call.transport.send(ElementWidgetActions.DeviceMute, state) resolves (EC has ACK'd the command), the function creates an inner Promise whose resolver is stored in this.mediaStatePromiseResolver — a field consumed only by onMediaState or by the NEXT call to setMediaState. If EC ACKs the command but does not subsequently fire a DeviceMute state-report back (the most likely trigger: the requested state already matches EC's current state and EC elides the echo, or EC is shutting down before broadcasting), the inner Promise is stranded forever. applyState() awaits this Promise at line 118 (await this.setMediaState({...})); the subsequent this.setSound(this.sound) and this.emitStateUpdate() calls at lines 122–123 are never reached. Because forceState (which calls applyState) is invoked fire-and-forget from onCallJoined, the practical result is that the initial deafen state and the first StateUpdate event emission are silently skipped on every call join when EC batches or omits the echo.
• Root Cause: The single-slot mediaStatePromiseResolver architecture gates the mute operation's completion on an EC-originated event that is not guaranteed to fire for every host-initiated command.
• Fix: Resolve the inner Promise directly when transport.send() returns — EC having replied already confirms the command was received and applied. Drop the new Promise(...) wrapper and return data immediately after await transport.send(). Keep onMediaState as the authoritative state-sync path (updating this.state and calling emitStateUpdate) but remove the mediaStatePromiseResolver field and its invocation from that handler entirely.

---

N123 — focusCameraParticipant tile click silently drops when EC spotlight layout isn't ready in 2 animation frames

• File: src/app/plugins/call/CallControl.ts, lines 396–401
• Status: OPEN [Claude_Found]
• Issue: After clicking spotlightButton to enter spotlight mode, focusCameraParticipant waits exactly two requestAnimationFrame callbacks (~32 ms at 60 fps) before querying the EC document for the target tile. If EC's React tree has not committed new spotlight tile nodes within that window — which occurs regularly on slower devices, during animated layout transitions, or when EC is simultaneously decoding video streams — findTile() returns undefined and the focus action is silently dropped. The user sees EC switch to spotlight mode but the requested participant is never pinned. There is no retry, no surfaced error, and the only signal is a DEV-only console.warn.
• Root Cause: The double-rAF heuristic is a timing approximation, not a DOM-readiness guarantee. EC's React reconciliation and layout commit can exceed 32 ms.
• Fix: Replace the double-rAF with a MutationObserver on this.document.body (childList + subtree) that waits for a [data-testid="videoTile"] element to appear, then calls applyFocus() and disconnects. Add a 600 ms hard-timeout fallback that calls applyFocus() and disconnects regardless, so the click is always attempted at least once even when tile rendering is slow.

---

N124 — Denoise shim cleanup() leaks the noise gate AudioWorkletNode processor thread when USE_GATE=true

• File: build/lotus-denoise.js, lines 235–244 and 267–281
• Status: OPEN [Claude_Found]
• Issue: When the noise gate is active (USE_GATE=true), processStream creates a gateNode (AudioWorkletNode) and wires it as source → gateNode → mlNode → dest. The cleanup() closure inside the inner .then() callback calls source.disconnect() and mlNode.disconnect() but never gateNode.disconnect(). gateNode is declared with var inside the outer if (USE_GATE) block — hoisted via var to the enclosing .then() function scope — and IS accessible in the inner callback via closure, but is simply absent from cleanup(). The AudioWorklet processor thread for the orphaned gate node continues running on the audio rendering thread until the EC iframe is destroyed. If EC's LiveKit client calls getUserMedia more than once within a session (e.g., a device switch mid-call), a new orphaned gate processor accumulates on each call, each consuming audio-thread CPU indefinitely.
• Root Cause: gateNode is in closure scope but missing from the cleanup() body.
• Fix: Add to cleanup():

  try { if (gateNode) gateNode.disconnect(); } catch (e) {}
  

---

N125 — Denoise shim postMessage uses wildcard '*' target origin

• File: build/lotus-denoise.js, lines 294–306 and 317–320
• Status: OPEN [Claude_Found]
• Issue: Both lotus-denoise-status postMessage calls use '*' as the targetOrigin argument, broadcasting the message to any frame that currently contains the EC iframe as a child regardless of its origin. If the Lotus EC widget URL is ever embedded by a third-party page (possible since it is same-origin and publicly routable), that page receives the denoise status payload ({ type, active, model, nativeNS, gate }). Using '*' violates the MDN/W3C postMessage security recommendation.
• Root Cause: The shim has no reference to the parent origin at the point these calls are made. The parentUrl widget URL parameter — already present in window.location.search and parsed into params at line 27 — provides the correct target origin.
• Fix: Extract parentUrl from params and use it as the target origin:

  var targetOrigin = params.get('parentUrl') || window.location.origin;
  window.parent.postMessage({ ... }, targetOrigin);
  

---

N126 — PiP position restored from localStorage without type validation, silently producing NaN coordinates on corrupt data

• File: src/app/components/CallEmbedProvider.tsx, line 723
• Status: OPEN [Claude_Found]
• Issue: The saved PiP position is cast without runtime validation:

  const savedPos = saved ? (JSON.parse(saved) as { left: number; top: number }) : null;
  

  If localStorage['pip-position'] contains a corrupted value (from a prior bug, a different app version's format, or a developer edit), JSON.parse may succeed but return an object where .left/.top are undefined, strings, or non-finite numbers. Math.max(0, Math.min(undefined, window.innerWidth - 280)) evaluates to NaN, yielding el.style.left = 'NaN px' — an invalid CSS value the browser silently ignores — and the PiP appears at an undefined position with no error surfaced.
• Root Cause: TypeScript as casts do not validate at runtime; the parsed value's shape is never checked.
• Fix: Add an explicit shape-and-finite guard:

  const raw = saved ? (() => { try { return JSON.parse(saved); } catch { return null; } })() : null;
  const savedPos =
    raw != null &&
    typeof raw.left === 'number' && isFinite(raw.left) &&
    typeof raw.top  === 'number' && isFinite(raw.top)
      ? (raw as { left: number; top: number })
      : null;
  

---

N127 — ML noise suppression shim is never injected in vite dev mode; the ML feature is silently inactive during development

• File: vite.config.js, lotusDenoise plugin, lines 72–193
• Status: OPEN [Claude_Found]
• Issue: The lotusDenoise plugin only defines a closeBundle Rollup/Vite build hook, which executes only during vite build. In vite dev, closeBundle is never invoked: lotus-denoise.js is never copied, and EC's index.html is never modified to include the shim <script> tag. EC loads its original entry from node_modules/@element-hq/element-call-embedded/dist/ without modification. When a developer enables ML noise suppression in Settings and joins a call, the lotusDenoise=ml URL parameter is correctly appended to the EC widget URL, but no shim intercepts getUserMedia inside the iframe and the mic is never routed through the ML pipeline. No error, warning, or status indicator surfaces this discrepancy; the lotus-denoise-status postMessage the shim would send never arrives, leaving any status display silently blank.
• Root Cause: The plugin has no configureServer hook for the dev-server path; viteStaticCopy serves the original EC assets from node_modules without modification in dev mode.
• Fix: Add a configureServer hook to lotusDenoise that installs two express middlewares: one serving build/lotus-denoise.js at /public/element-call/lotus-denoise.js, and one intercepting GET requests for /public/element-call/index.html that reads the original from node_modules/@element-hq/element-call-embedded/dist/index.html, injects the <script src="./lotus-denoise.js"></script> tag (mirroring the production replacement regex), and returns the patched HTML. This makes dev and production consistent for ML noise suppression testing.