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/SidePanel.tsx

@@ -47,9 +47,7 @@ export default function SidePanel({
     // content instead of pushing it. Pinned reserves the full width (in-flow), as before.
     <div
       {...peek.handlers}
-      className={`hidden md:block relative shrink-0 transition-[width] ${
-        pinned ? "w-[268px]" : "w-9"
-      }`}
+      className={`hidden md:block relative shrink-0 transition-[width] ${pinned ? "w-67" : "w-9"}`}
     >
       {/* The tab: a small handle flush against the nav rail, flat on the docked edge. It stays
           mounted while the card is open — swapping it out from under the pointer would drop the very
@@ -66,12 +64,12 @@ export default function SidePanel({
       >
         <span className="text-accent">{icon}</span>
         {count > 0 && (
-          <span className="bg-accent text-accent-fg text-[10px] font-bold px-1.5 py-0.5 rounded-full tabular-nums">
+          <span className="bg-accent text-accent-fg text-3xs font-bold px-1.5 py-0.5 rounded-full tabular-nums">
             {count > 9 ? "9+" : count}
           </span>
         )}
         <span
-          className="text-[11px] font-semibold uppercase tracking-[0.18em] text-muted"
+          className="text-2xs font-semibold uppercase tracking-[0.18em] text-muted"
           style={{ writingMode: "vertical-rl", transform: "rotate(180deg)" }}
         >
           {title}
@@ -98,7 +96,7 @@ export default function SidePanel({
             {count > 0 && (
               <span
                 title={t("sidebar.activeCount", { count })}
-                className="shrink-0 min-w-[18px] h-[18px] px-1.5 rounded-full bg-accent/15 text-accent text-[11px] font-semibold inline-flex items-center justify-center tabular-nums"
+                className="shrink-0 min-w-4.5 h-4.5 px-1.5 rounded-full bg-accent/15 text-accent text-2xs font-semibold inline-flex items-center justify-center tabular-nums"
               >
                 {count}
               </span>
@@ -138,7 +136,7 @@ export default function SidePanel({
             className="flex-1 min-h-0 overflow-y-auto no-scrollbar"
           >
             <div className="p-3 space-y-3">
-              {editing && editHint && <div className="text-[11px] text-muted">{editHint}</div>}
+              {editing && editHint && <div className="text-2xs text-muted">{editHint}</div>}
               {children}
             </div>
           </div>