🐛(frontend) center Avatar initials with a font-aware cap-height ratio

The previous implementation centered initials by measuring `<text>`
with `getBBox()`, which returns the font's advance-width by
ascent-to-descent band, not the ink of the glyphs. On fonts with an
asymmetric band, initials rendered off-center. Marianne is a
particularly clear case: ascent 1131 / descent 256 puts the band
center 87.5/1000 above the caps' optical center, so every avatar
sat ~4.6 viewBox units (~1.5–1.8 px) too low. A follow-up rewrite
using canvas `actualBoundingBox*` metrics fixed it but pulled in a
runtime measurement rig (shared canvas, ref, state, layout effect,
`fonts.load` + `loadingdone`, plus combining-mark stripping) just
to place two uppercase letters.

Since initials are always uppercased, optical centering has a
closed form: `baseline = center + capHeight/2`. Real-world text
fonts have cap heights in a narrow ~0.66–0.73 em band (Marianne is
0.70), so:

    translateY(calc(var(--avatar-cap-height, 0.7) * 0.5em))

is exact for the stock font and within ~0.4 px for any plausible
replacement. No JS, SSR-safe, no first-paint jump, no font-loading
race. Accents float above the cap box instead of dragging the
letter down.

The single font-dependent number remaining (cap height) is exposed
as a CSS variable, so self-hosters overriding the font can override
it next to the font itself, or leave the default. Once
`text-box: trim-both cap alphabetic` ships broadly, even the
variable can go.

CHANGELOG.md

@@ -17,7 +17,6 @@ and this project adheres to
 ### Changed
 
 - ⬆️(dev) pin LiveKit server to v1.13.6
-- 🔒(frontend) upgrade base image to 1.30.4-alpine3.24
 
 ### Fixed
 
@@ -25,7 +24,6 @@ and this project adheres to
 - 🐛(frontend) keep the sending resolution picked while the camera is off #1667
 - 🐛(frontend) restore automatic lower-hand on speaking
 - 🐛(frontend) center Avatar initials with a font-aware cap-height ratio
-- 🐛(frontend) keep feedback buttons on one line for fr/es/en
 
 ## [1.30.0] - 2026-09-01
 

docker/dinum-frontend/Dockerfile

@@ -54,11 +54,19 @@ RUN npx webpack --mode production
 
 
 # ---- Front-end image ----
-FROM nginxinc/nginx-unprivileged:1.30.4-alpine3.24 AS frontend-production
+FROM nginxinc/nginx-unprivileged:1.30.3-alpine3.23 AS frontend-production
 
 USER root
-RUN apk del curl
+
-USER nginx
+# Security patches for known CVEs
+RUN apk update && apk upgrade  \
+    libcrypto3>=3.5.7-r0 \
+    libssl3>=3.5.7-r0 \
+    musl \
+    musl-utils \
+    zlib>=1.3.2-r0 \
+    libexpat>=2.8.4-r0 \
+    && apk del curl
 
 USER nginx
 

src/frontend/Dockerfile

@@ -42,10 +42,20 @@ ENV VITE_APP_TITLE=${VITE_APP_TITLE}
 RUN npm run build
 
 # ---- Front-end image ----
-FROM nginxinc/nginx-unprivileged:1.30.4-alpine3.24 AS frontend-production
+FROM nginxinc/nginx-unprivileged:1.30.3-alpine3.23 AS frontend-production
 
 USER root
-RUN apk del curl
+
+# Security patches for known CVEs
+RUN apk update && apk upgrade  \
+    libcrypto3>=3.5.7-r0 \
+    libssl3>=3.5.7-r0 \
+    musl \
+    musl-utils \
+    zlib>=1.3.2-r0 \
+    libexpat>=2.8.4-r0 \
+    && apk del curl
+
 USER nginx
 
 # Un-privileged user running the application

src/frontend/src/features/rooms/routes/Feedback.tsx

@@ -65,7 +65,7 @@ const FeedbackRoute = () => {
           <Stack
             direction={{ base: 'column', xsm: 'row' }}
             width={{ base: '100%', xsm: 'auto' }}
-            maxWidth="410px"
+            maxWidth="380px"
           >
             {showBackButton && (
               <Button