feat: classes admin collapsible cards, icon curation, color fix + user-side polish

Admin classes:
- Collapsible cards in ArrayEditor (start collapsed, expand on click)
- Curated 29 dance-relevant icons shown by default, full search as fallback
- Color swatches: used colors dimmed instead of hidden (no layout shift)

User side:
- Classes: icon + name side by side on photo overlay
- ShowcaseLayout: fix image flash during transition (2-frame swap while hidden)
- Team bio: section headings gold, admin cards focus-within highlight

src/components/ui/ShowcaseLayout.tsx

@@ -43,14 +43,24 @@ export function ShowcaseLayout<T>({
     }
   }, [displayIndex, fading]);
 
+  const [fadingIn, setFadingIn] = useState(false);
+
   useEffect(() => {
     if (activeIndex === displayIndex) return;
     setFading(true);
-    const timeout = setTimeout(() => {
+    // Wait for fade-out, then swap content while hidden
+    const fadeOut = setTimeout(() => {
       setDisplayIndex(activeIndex);
-      setFading(false);
+      // Keep hidden for one frame so new content renders before fade-in
+      setFadingIn(true);
+      requestAnimationFrame(() => {
+        requestAnimationFrame(() => {
+          setFading(false);
+          setFadingIn(false);
+        });
+      });
     }, UI_CONFIG.showcase.fadeMs);
-    return () => clearTimeout(timeout);
+    return () => clearTimeout(fadeOut);
   }, [activeIndex, displayIndex]);
 
   // Auto-scroll selector only when item is out of view
@@ -136,7 +146,7 @@ export function ShowcaseLayout<T>({
           <div
             ref={detailRef}
             className={`transition-all duration-300 ease-out ${
-              fading
+              fading || fadingIn
                 ? "opacity-0 translate-y-2"
                 : "opacity-100 translate-y-0"
             }`}