Merge branch 'lotus' into fix/animated-bg-compositor

matrix.lotusguild.org turned off open registration (2026-10-16; accounts
come from SSO/LLDAP), so the login page's registration probe
(POST /_matrix/client/v3/register) now answers 403 "Registration has been
disabled" instead of 401 + UIA flows. The boot smoke test treated that
console line as unexpected and failed on every branch (seen on #360).

collectConsole now skips a 403 only when its source URL is the register
endpoint; any other 403 still fails the test.

Verified: boot.spec passes locally in chromium, webkit and iphone.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_017PCb59uY3UKqDqt7B6hzd5

e2e/helpers.ts

@@ -42,7 +42,18 @@ export function collectConsole(page: Page): ConsoleCollector {
   const errors: string[] = [];
   const pageErrors: string[] = [];
   page.on('console', (msg) => {
-    if (msg.type() === 'error') errors.push(msg.text());
+    if (msg.type() !== 'error') return;
+    // The login page's registration probe (POST /_matrix/client/v3/register)
+    // answers 403 "Registration has been disabled" on a homeserver with sign-up
+    // closed (matrix.lotusguild.org since 2026-10-16: accounts come from SSO).
+    // Allowed only for that URL so any other 403 still fails the test.
+    if (
+      /status of 403/.test(msg.text()) &&
+      /\/_matrix\/client\/v3\/register/.test(msg.location().url)
+    ) {
+      return;
+    }
+    errors.push(msg.text());
   });
   page.on('pageerror', (err) => {
     pageErrors.push(err.message);

src/app/components/message/MsgTypeRenderers.tsx

@@ -1,4 +1,4 @@
-import React, { CSSProperties, ReactNode, useEffect, useRef, useState } from 'react';
+import React, { CSSProperties, ReactNode, useEffect, useId, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Box, Button, config, Icon, Icons, Text, color, toRem } from 'folds';
 import { IContent, MatrixEvent } from 'matrix-js-sdk';
@@ -41,7 +41,10 @@ import { formatAccuracy } from '../../utils/geoShare';
 import { Attachment, AttachmentBox, AttachmentContent, AttachmentHeader } from './attachment';
 import { FileHeader, FileDownloadButton } from './FileHeader';
 
-const COLLAPSE_MAX_HEIGHT = 320; // px ≈ 20 lines
+// ≈ 20 lines; in rem so a larger font setting doesn't show fewer lines (Gitea #343).
+const COLLAPSE_MAX_HEIGHT_REM = 20;
+const collapseMaxHeightPx = (): number =>
+  COLLAPSE_MAX_HEIGHT_REM * (parseFloat(getComputedStyle(document.documentElement).fontSize) || 16);
 
 type CollapsibleBodyProps = {
   eventId?: string;
@@ -79,7 +82,7 @@ function CollapsibleBody({ eventId, children }: CollapsibleBodyProps) {
     const el = bodyRef.current;
     if (!el) return undefined;
     const observer = new ResizeObserver(() => {
-      setNeedsCollapse(el.scrollHeight > COLLAPSE_MAX_HEIGHT);
+      setNeedsCollapse(el.scrollHeight > collapseMaxHeightPx());
     });
     observer.observe(el);
     return () => observer.disconnect();
@@ -89,16 +92,36 @@ function CollapsibleBody({ eventId, children }: CollapsibleBodyProps) {
   // (Gitea #85); useReducedMotion subscribes to the change event instead.
   const prefersReducedMotion = useReducedMotion();
 
+  const bodyId = useId();
+  const isClipped = needsCollapse && collapsed;
+  // [Gitea #343] The clipped part stays in the DOM, so Tab can reach a link in
+  // it; the browser would then scroll the overflow:hidden box itself (top cut
+  // off, and it stayed that way). Expand instead when focus lands inside.
+  const handleFocus = () => {
+    if (isClipped) setCollapsed(false);
+  };
+  useEffect(() => {
+    if (isClipped && bodyRef.current) bodyRef.current.scrollTop = 0;
+  }, [isClipped]);
+
+  // Fade the content itself rather than painting a fixed-colour gradient over
+  // it, so it blends on any background (bubbles, highlights, chat backgrounds).
+  const fadeMask = 'linear-gradient(#000 calc(100% - 3rem), transparent)';
+
   return (
     <div>
       <div
         ref={bodyRef}
+        id={bodyId}
+        onFocus={handleFocus}
         style={{
           position: 'relative',
-          ...(needsCollapse && collapsed
+          ...(isClipped
             ? {
-                maxHeight: `${COLLAPSE_MAX_HEIGHT}px`,
+                maxHeight: `${COLLAPSE_MAX_HEIGHT_REM}rem`,
                 overflow: 'hidden',
+                maskImage: fadeMask,
+                WebkitMaskImage: fadeMask,
                 transition: prefersReducedMotion ? undefined : 'max-height 0.2s ease',
               }
             : {
@@ -107,23 +130,12 @@ function CollapsibleBody({ eventId, children }: CollapsibleBodyProps) {
         }}
       >
         {children}
-        {needsCollapse && collapsed && (
-          <div
-            style={{
-              position: 'absolute',
-              bottom: 0,
-              left: 0,
-              right: 0,
-              height: '3rem',
-              background: `linear-gradient(transparent, ${color.Surface.Container})`,
-              pointerEvents: 'none',
-            }}
-          />
-        )}
       </div>
       {needsCollapse && (
         <button
           type="button"
+          aria-expanded={!collapsed}
+          aria-controls={bodyId}
           onClick={() => setCollapsed((c) => !c)}
           style={{
             cursor: 'pointer',
@@ -134,7 +146,8 @@ function CollapsibleBody({ eventId, children }: CollapsibleBodyProps) {
           }}
         >
           <Text as="span" size="T200" style={{ color: color.Primary.Main }}>
-            {collapsed ? 'Read more ↓' : 'Show less ↑'}
+            {collapsed ? 'Read more' : 'Show less'}
+            <span aria-hidden="true">{collapsed ? ' ↓' : ' ↑'}</span>
           </Text>
         </button>
       )}

src/app/features/lotus/backgrounds/animAurora.ts

@@ -51,7 +51,7 @@ const dark: CSSProperties = {
   backgroundSize: '260% 240%, 300% 260%, 240% 280%, 220% 200%, 100% 100%, 100% 100%',
   backgroundPosition: '0% 30%, 100% 70%, 50% 0%, 20% 80%, 50% 50%, 50% 50%',
   backgroundRepeat: 'no-repeat',
-  animation: `${auroraFlow} 60s ease-in-out infinite`,
+  animation: `${auroraFlow} 60s steps(180) infinite`,
 };
 
 const light: CSSProperties = {
@@ -75,7 +75,7 @@ const light: CSSProperties = {
   backgroundSize: '260% 240%, 300% 260%, 240% 280%, 220% 200%, 100% 100%, 100% 100%',
   backgroundPosition: '0% 30%, 100% 70%, 50% 0%, 20% 80%, 50% 50%, 50% 50%',
   backgroundRepeat: 'no-repeat',
-  animation: `${auroraFlow} 60s ease-in-out infinite`,
+  animation: `${auroraFlow} 60s steps(180) infinite`,
 };
 
 export const animAurora: ChatBgVariants = { dark, light };

src/app/features/lotus/backgrounds/animFireflies.ts

@@ -55,7 +55,7 @@ export const animFireflies: ChatBgVariants = {
       '0 0', // wash A   (static)
       '0 0', // wash B   (static)
     ].join(','),
-    animation: `${firefliesDrift} 44s linear infinite`,
+    animation: `${firefliesDrift} 44s steps(528) infinite`,
   },
 
   // Light: a cozy warm dim-dusk. No harsh dots on white — soft amber motes with
@@ -93,6 +93,6 @@ export const animFireflies: ChatBgVariants = {
       '0 0', // wash A   (static)
       '0 0', // wash B   (static)
     ].join(','),
-    animation: `${firefliesDrift} 44s linear infinite`,
+    animation: `${firefliesDrift} 44s steps(528) infinite`,
   },
 };

src/app/features/lotus/backgrounds/animPulse.ts

@@ -76,7 +76,7 @@ export const animPulse: ChatBgVariants = {
       '0 0', // base wash
       '0 0', // vignette
     ].join(','),
-    animation: `${gridPulse} 22s ease-in-out infinite`,
+    animation: `${gridPulse} 22s steps(528) infinite`,
   },
 
   // Light: soft slate-blue grid on pale cool-white, a gentle luminance breathe.
@@ -116,6 +116,6 @@ export const animPulse: ChatBgVariants = {
       '0 0', // base wash
       '0 0', // vignette
     ].join(','),
-    animation: `${gridPulse} 22s ease-in-out infinite`,
+    animation: `${gridPulse} 22s steps(528) infinite`,
   },
 };

src/app/features/lotus/backgrounds/animRain.ts

@@ -97,7 +97,7 @@ export const animRain: ChatBgVariants = {
     ].join(','),
     backgroundSize: ['260px 200px', '100% 100%', '100% 100%', '100% 100%'].join(','),
     backgroundPosition: ['0 0', '0 0', '0 0', '0 0'].join(','),
-    animation: `${rainFall} 12s linear infinite`,
+    animation: `${rainFall} 12s steps(288) infinite`,
   },
 
   // Light: soft teal-grey streaks on a pale cool base — elegant, never neon.
@@ -118,6 +118,6 @@ export const animRain: ChatBgVariants = {
     ].join(','),
     backgroundSize: ['260px 200px', '100% 100%', '100% 100%', '100% 100%'].join(','),
     backgroundPosition: ['0 0', '0 0', '0 0', '0 0'].join(','),
-    animation: `${rainFall} 12s linear infinite`,
+    animation: `${rainFall} 12s steps(288) infinite`,
   },
 };

src/app/features/lotus/backgrounds/animStars.ts

@@ -68,7 +68,7 @@ export const animStars: ChatBgVariants = {
       '0 0', // nebula A
       '0 0', // nebula B
     ].join(','),
-    animation: `${starDrift} 90s linear infinite`,
+    animation: `${starDrift} 90s steps(1080) infinite`,
   },
 
   // Light: an airy pre-dawn sky. No literal white-on-white stars — instead very
@@ -112,6 +112,6 @@ export const animStars: ChatBgVariants = {
       '0 0', // wash A
       '0 0', // wash B
     ].join(','),
-    animation: `${starDrift} 100s linear infinite`,
+    animation: `${starDrift} 100s steps(1200) infinite`,
   },
 };

src/app/features/lotus/chatBackground.ts

@@ -149,6 +149,11 @@ export const getChatBg = (
   }
   // For animated backgrounds, promote the element to its own compositor layer so
   // background-position keyframes don't trigger repaints on descendant elements.
+  // [Gitea #337] background-position can't run on the compositor, so every
+  // animation frame repaints the whole chat area (45 to 70% main-thread busy
+  // at 60 fps). The drifts are slow (3–22 px/s), so each animation uses steps():
+  // ~12 updates/s for the slow ones, ~24/s for rain and pulse: visually the
+  // same, a fraction of the repaints.
   if (style.animation) {
     return { ...style, willChange: 'background-position', contain: 'paint' };
   }

src/app/state/plaintextCaches.test.ts

@@ -83,3 +83,14 @@ test('clearPlaintextCaches wipes drafts (#41) and the status message (#204) but
   assert.ok(!removed.includes('cinny_session'), 'session key not this module’s concern');
   assert.ok(store.has('cinny_session'));
 });
+
+test('clearPlaintextCaches removes the call-volume list and the settings-sync stamp (#347)', () => {
+  store.clear();
+  store.set('lotus-per-user-volume', '{"@bob:server":0.3}');
+  store.set('settings-sync-meta:@me:server', '{"lastSyncedAt":1}');
+  store.set('settings', '{}');
+  clearPlaintextCaches('@me:server');
+  assert.equal(store.has('lotus-per-user-volume'), false);
+  assert.equal(store.has('settings-sync-meta:@me:server'), false);
+  assert.equal(store.has('settings'), true, 'device preferences are kept');
+});

src/app/state/plaintextCaches.ts

@@ -47,6 +47,8 @@ const clearMsgDrafts = (): void => {
  * - `cinny_recent_gifs_v1` / `cinny_recent_stickers_v1` — media the user sent
  * - `navToActivePath<userId>` — per-space last-visited room paths (needs userId)
  * - `lotus_outbox_v1` — decrypted content of messages not yet sent ([Gitea #112])
+ * - `lotus-per-user-volume`, `settings-sync-meta:<userId>` — whom you adjusted in
+ *   calls, and a key naming the account ([Gitea #347])
  * - `draft-msg-*` — unsent composer drafts (decrypted message text, unscoped by
  *   user — see [Gitea #41]; previously deliberately preserved across logout
  *   (N98), which let the next account on this device see/send a prior user's
@@ -92,6 +94,24 @@ const clearStatusMessage = (): void => {
   });
 };
 
+/**
+ * [Gitea #347] Per-person residue that isn't message text but still says whom
+ * the previous user dealt with: Element Call's per-user volume memory (same
+ * origin on the web — element-call `lotusVolumeMemory.ts`) and the settings-sync
+ * stamp, whose key names the account.
+ */
+export const CALL_VOLUME_KEY = 'lotus-per-user-volume';
+const clearCallVolumesAndSyncMeta = (userId?: string): void => {
+  const keys = [CALL_VOLUME_KEY, ...(userId ? [`settings-sync-meta:${userId}`] : [])];
+  keys.forEach((key) => {
+    try {
+      localStorage.removeItem(key);
+    } catch {
+      // best-effort
+    }
+  });
+};
+
 export const clearPlaintextCaches = (userId?: string): void => {
   clearTranslationCache();
   clearScheduledMessages();
@@ -103,5 +123,6 @@ export const clearPlaintextCaches = (userId?: string): void => {
   clearOutbox();
   clearCallSession();
   clearStatusMessage();
+  clearCallVolumesAndSyncMeta(userId);
   if (userId) clearNavToActivePathStore(userId);
 };

src/app/utils/linkSafety.test.ts

@@ -38,3 +38,38 @@ test('hostFromText only accepts URL/host-shaped text; IDN becomes punycode', ()
   assert.equal(analyzeLink('paypal.com', 'https://xn--pypal-4ve.com/')?.punycode, true);
   assert.equal(analyzeLink('paypal.com', 'https://xn--pypal-4ve.com/')?.mismatch, true);
 });
+
+test('a trusted name inside a sentence still exposes a different destination (#335)', () => {
+  const a = analyzeLink('Log in at chat.lotusguild.org', 'https://evil.example/');
+  assert.equal(a?.mismatch, true);
+  assert.equal(a?.shownHost, 'chat.lotusguild.org');
+  assert.equal(
+    analyzeLink('chat.lotusguild.org (official)', 'https://evil.example/')?.mismatch,
+    true,
+  );
+  assert.equal(
+    analyzeLink('Open https://paypal.com/login now', 'https://evil.example/')?.mismatch,
+    true,
+  );
+  // honest sentences are not flagged
+  assert.equal(
+    analyzeLink('Log in at chat.lotusguild.org', 'https://chat.lotusguild.org/login')?.mismatch,
+    false,
+  );
+  assert.equal(analyzeLink('read the docs', 'https://evil.example/')?.mismatch, false);
+  assert.equal(analyzeLink('see main.py and report.pdf', 'https://github.com/x')?.mismatch, false);
+  assert.equal(analyzeLink('release v1.2.3 notes', 'https://github.com/x')?.mismatch, false);
+});
+
+test('shared hosting suffixes are separate sites (#335)', () => {
+  assert.equal(registrableDomain('alice.github.io'), 'alice.github.io');
+  assert.equal(registrableDomain('www.alice.github.io'), 'alice.github.io');
+  assert.equal(registrableDomain('bucket.s3.amazonaws.com'), 'bucket.s3.amazonaws.com');
+  assert.equal(analyzeLink('alice.github.io', 'https://evil.github.io/')?.mismatch, true);
+  assert.equal(analyzeLink('lotusguild.pages.dev', 'https://evil.pages.dev/')?.mismatch, true);
+  assert.equal(
+    analyzeLink('alice.github.io/blog', 'https://alice.github.io/blog/1')?.mismatch,
+    false,
+  );
+  assert.equal(registrableDomain('news.bbc.co.uk'), 'bbc.co.uk');
+});

src/app/utils/linkSafety.ts

@@ -48,11 +48,53 @@ const TWO_LABEL_SUFFIXES = new Set([
   'com.tw',
 ]);
 
+// [Gitea #335] Shared-hosting suffixes (the Public Suffix List's "private"
+// section, the ones phishing actually uses): every customer gets their own
+// subdomain, so `alice.github.io` and `evil.github.io` are different sites.
+// A curated list rather than the full PSL keeps this out of the bundle budget.
+const SHARED_HOSTING_SUFFIXES = new Set([
+  'github.io',
+  'gitlab.io',
+  'codeberg.page',
+  'pages.dev',
+  'workers.dev',
+  'trycloudflare.com',
+  'netlify.app',
+  'vercel.app',
+  'web.app',
+  'firebaseapp.com',
+  'appspot.com',
+  'herokuapp.com',
+  'onrender.com',
+  'fly.dev',
+  'glitch.me',
+  'replit.app',
+  'repl.co',
+  'surge.sh',
+  'blogspot.com',
+  'wordpress.com',
+  'wixsite.com',
+  'weebly.com',
+  'azurewebsites.net',
+  'cloudfront.net',
+  'ngrok.io',
+  'ngrok-free.app',
+  'duckdns.org',
+  's3.amazonaws.com',
+]);
+
+const isPublicSuffix = (suffix: string): boolean =>
+  TWO_LABEL_SUFFIXES.has(suffix) || SHARED_HOSTING_SUFFIXES.has(suffix);
+
 export const registrableDomain = (host: string): string => {
   const labels = host.toLowerCase().replace(/\.$/, '').split('.');
-  if (labels.length <= 2) return labels.join('.');
-  const lastTwo = labels.slice(-2).join('.');
-  return TWO_LABEL_SUFFIXES.has(lastTwo) ? labels.slice(-3).join('.') : lastTwo;
+  // Longest matching public suffix wins (3 labels, e.g. s3.amazonaws.com, then 2).
+  for (const n of [3, 2]) {
+    if (labels.length > n && isPublicSuffix(labels.slice(-n).join('.'))) {
+      return labels.slice(-(n + 1)).join('.');
+    }
+  }
+  return labels.slice(-2).join('.');
 };
 
 const HOST_LIKE =
@@ -72,6 +114,85 @@ export const hostFromText = (text: string): string | null => {
   }
 };
 
+// Words that look like hosts but are usually files or versions in chat
+// ("see main.py", "report.pdf", "v1.2.3"): skipped inside sentences unless
+// written as a URL (scheme, www., or a path) so ordinary links aren't flagged.
+const FILE_EXTENSIONS = new Set([
+  'py',
+  'sh',
+  'md',
+  'rs',
+  'js',
+  'ts',
+  'tsx',
+  'jsx',
+  'json',
+  'yaml',
+  'yml',
+  'toml',
+  'txt',
+  'log',
+  'csv',
+  'pdf',
+  'zip',
+  'gz',
+  'tar',
+  'png',
+  'jpg',
+  'jpeg',
+  'gif',
+  'webp',
+  'svg',
+  'mp3',
+  'mp4',
+  'mov',
+  'html',
+  'htm',
+  'css',
+  'exe',
+  'dll',
+  'lock',
+  'cfg',
+  'conf',
+  'ini',
+  'xml',
+  'doc',
+  'docx',
+  'xls',
+  'xlsx',
+  'ppt',
+  'pptx',
+  'apk',
+  'iso',
+  'jar',
+  'java',
+  'go',
+  'rb',
+  'php',
+  'c',
+  'h',
+  'cpp',
+]);
+const TRIM_PUNCT = /^[\s"'“”‘’«»([{<]+|[\s"'“”‘’«»)\]}>.,;:!?]+$/g;
+
+/** Every host a sentence names (Gitea #335), e.g. "Log in at chat.lotusguild.org". */
+export const hostsFromText = (text: string): string[] => {
+  const hosts: string[] = [];
+  text.split(/\s+/).forEach((raw) => {
+    const word = raw.replace(TRIM_PUNCT, '');
+    const host = word && hostFromText(word);
+    if (!host) return;
+    const tld = host.split('.').pop() ?? '';
+    if (!/[a-z]/i.test(tld)) return; // version numbers, IPs-as-words
+    const urlShaped =
+      /^[a-z][a-z0-9+.-]*:\/\//i.test(word) || /^www\./i.test(word) || word.includes('/');
+    if (!urlShaped && host.split('.').length === 2 && FILE_EXTENSIONS.has(tld.toLowerCase()))
+      return;
+    if (!hosts.includes(host)) hosts.push(host);
+  });
+  return hosts;
+};
+
 export type LinkSafety = {
   /** The visible text names a different site than the destination. */
   mismatch: boolean;
@@ -92,8 +213,11 @@ export const analyzeLink = (text: string, href: string): LinkSafety | null => {
   if (url.hostname === 'matrix.to') return null;
   const realHost = url.hostname;
   const punycode = realHost.split('.').some((l) => l.startsWith('xn--'));
-  const shownHost = hostFromText(text) ?? undefined;
-  const mismatch =
-    shownHost !== undefined && registrableDomain(shownHost) !== registrableDomain(realHost);
-  return { mismatch, shownHost, realHost, punycode };
+  // A single URL/host-shaped text, or (Gitea #335) host-shaped words inside a
+  // sentence: "Log in at chat.lotusguild.org" must not hide a different site.
+  const single = hostFromText(text);
+  const shown = single ? [single] : hostsFromText(text);
+  const realSite = registrableDomain(realHost);
+  const other = shown.find((h) => registrableDomain(h) !== realSite);
+  return { mismatch: other !== undefined, shownHost: other ?? shown[0], realHost, punycode };
 };

src/app/utils/settingsSync.test.ts

@@ -104,3 +104,9 @@ describe('buildSyncedContent', () => {
     assert.deepEqual(c.settings, pickSyncable(base));
   });
 });
+
+describe('device-local keys', () => {
+  it('keeps enterForNewline on each device (#348)', () => {
+    assert.equal(DEVICE_LOCAL_KEYS.has('enterForNewline'), true);
+  });
+});

src/app/utils/settingsSync.ts

@@ -49,6 +49,9 @@ export const DEVICE_LOCAL_KEYS: ReadonlySet<keyof Settings> = new Set<keyof Sett
   'ringtoneVolume',
   'soundboardVolume',
   'cameraOnJoin',
+  // [Gitea #348] Enter = new line suits a phone keyboard, Enter = send a desktop one;
+  // syncing it switched the desktop to Ctrl+Enter when set on the phone.
+  'enterForNewline',
 ]);
 
 /** The subset of `settings` that is synced (deep-copied so callers can't alias). */