feat(theme): R10 S2 — re-close the rem system (px-frozen labels/chrome -> rem)

The ~124 px-frozen text-[Npx] labels didn't track the Settings font-scale slider
while their rem-sized neighbours did. Add text-2xs (0.6875rem) / text-3xs
(0.625rem) font-size-ONLY tokens (no paired line-height -> matches the arbitrary
they replace, zero vertical-rhythm shift) and codemod every text-[Npx] to a rem
class (rare 8/9/12/13px -> rem arbitraries).

Also: --hdr-h 68px -> 4.25rem so header content clears the rem-sized pills at
scale 1.3 instead of sliding under; NavSidebar/SidePanel slot widths + their
icon/badge px sizes go rem so the rails keep pace with their (now-scaling)
labels; a w-24/h-[54px] thumb -> h-13.5 to preserve 16:9 at scale. Media
thumbnails, page-width caps and fixed container widths deliberately stay px.

Verified via getComputedStyle at scale 1.06/1.3: text-2xs 11.66->14.3px, header
clearance 72->88px, nav slot 246->302px — all scale proportionally.

frontend/src/components/NotificationsPanel.tsx

@@ -263,7 +263,7 @@ function NotificationRow({
       <div className="flex-1 min-w-0">
         <div className="flex items-baseline gap-2">
           <span className="font-medium text-sm">{title}</span>
-          <span className="text-[11px] text-muted shrink-0">{relativeTime(n.created_at)}</span>
+          <span className="text-2xs text-muted shrink-0">{relativeTime(n.created_at)}</span>
         </div>
         {body && <div className="text-sm text-muted mt-0.5">{body}</div>}
         {videos.length > 0 && (
@@ -348,15 +348,15 @@ function ClientActivityRow({
         <div className="text-sm wrap-break-word">
           {n.message}
           {n.repeat > 1 && (
-            <span className="ml-1.5 align-middle text-[11px] font-semibold text-muted tabular-nums">
+            <span className="ml-1.5 align-middle text-2xs font-semibold text-muted tabular-nums">
               ×{n.repeat}
             </span>
           )}
         </div>
         <div className="flex items-center gap-2 mt-0.5">
-          <span className="text-[11px] text-muted">{relativeFromMs(n.ts)}</span>
+          <span className="text-2xs text-muted">{relativeFromMs(n.ts)}</span>
           {needsAction && (
-            <span className="text-[10px] uppercase tracking-wide font-semibold text-accent">
+            <span className="text-3xs uppercase tracking-wide font-semibold text-accent">
               {t("notifications.actionNeeded")}
             </span>
           )}