fix(ui): wait for the icon font itself before revealing Material Symbols

`document.fonts.ready` resolved before the 4MB Material Symbols woff2 even
started loading — it runs in <head>, ahead of any element that would trigger
the lazy fetch. The `fonts-loaded` class landed early, so icons rendered
blank until a second load served the font from disk cache.

Load the face explicitly and swap visibility for opacity, with a 3s fallback
so icons never stay hidden if the font fails.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

src/app/globals.css

@@ -4,8 +4,8 @@
 @custom-variant dark (&:where(.dark, .dark *));
 
 /* Hide icon ligature text until font is ready */
-.material-symbols-outlined { visibility: hidden; }
-.fonts-loaded .material-symbols-outlined { visibility: visible; }
+.material-symbols-outlined { opacity: 0; }
+.fonts-loaded .material-symbols-outlined { opacity: 1; transition: opacity .12s ease-out; }
 
 /* ============================================================
    9Router palette — adopted from 9remote_private/web