Update app.py

app.py

@@ -55,6 +55,9 @@ PARAM_DIMS = [10, 63, 45, 45, 3, 10, 3, 3]
 PARAM_NAMES = ["betas", "body_pose", "left_hand_pose", "right_hand_pose",
                "trans", "expression", "jaw_pose", "eye_pose"]
 
+# Visualization defaults
+AVATAR_COLOR = "#5CB85C"
+
 # =====================================================================
 # Install/Import Dependencies
 # =====================================================================
@@ -497,7 +500,7 @@ def create_animation_html(verts: np.ndarray, faces: np.ndarray, fps: int = 20,
     mesh = go.Mesh3d(
         x=verts[0, :, 0], y=verts[0, :, 1], z=verts[0, :, 2],
         i=i, j=j, k=k, flatshading=True, opacity=0.6,
-        color='#6FA8DC',
+        color=AVATAR_COLOR,
         lighting=dict(ambient=0.6, diffuse=0.7, specular=0.2)
     )
     
@@ -506,7 +509,7 @@ def create_animation_html(verts: np.ndarray, faces: np.ndarray, fps: int = 20,
             data=[go.Mesh3d(
                 x=verts[t, :, 0], y=verts[t, :, 1], z=verts[t, :, 2],
                 i=i, j=j, k=k, flatshading=True, opacity=0.6,
-                color='#6FA8DC',
+                color=AVATAR_COLOR,
                 lighting=dict(ambient=0.6, diffuse=0.7, specular=0.2)
             )],
             name=str(t)
@@ -613,12 +616,12 @@ def create_side_by_side_html(verts1, faces1, verts2, faces2, title1="", title2="
     
     mesh1 = go.Mesh3d(
         x=verts1[0, :, 0], y=verts1[0, :, 1], z=verts1[0, :, 2],
-        i=i1, j=j1, k=k1, flatshading=True, opacity=0.6, color='#6FA8DC',
+        i=i1, j=j1, k=k1, flatshading=True, opacity=0.6, color=AVATAR_COLOR,
         lighting=dict(ambient=0.6, diffuse=0.7, specular=0.2), scene='scene'
     )
     mesh2 = go.Mesh3d(
         x=verts2[0, :, 0], y=verts2[0, :, 1], z=verts2[0, :, 2],
-        i=i2, j=j2, k=k2, flatshading=True, opacity=0.6, color='#93C47D',
+        i=i2, j=j2, k=k2, flatshading=True, opacity=0.6, color=AVATAR_COLOR,
         lighting=dict(ambient=0.6, diffuse=0.7, specular=0.2), scene='scene2'
     )
     
@@ -631,10 +634,10 @@ def create_side_by_side_html(verts1, faces1, verts2, faces2, title1="", title2="
             name=str(t),
             data=[
                 go.Mesh3d(x=verts1[t, :, 0], y=verts1[t, :, 1], z=verts1[t, :, 2],
-                         i=i1, j=j1, k=k1, flatshading=True, opacity=0.6, color='#6FA8DC',
+                         i=i1, j=j1, k=k1, flatshading=True, opacity=0.6, color=AVATAR_COLOR,
                          lighting=dict(ambient=0.6, diffuse=0.7, specular=0.2), scene='scene'),
                 go.Mesh3d(x=verts2[t, :, 0], y=verts2[t, :, 1], z=verts2[t, :, 2],
-                         i=i2, j=j2, k=k2, flatshading=True, opacity=0.6, color='#93C47D',
+                         i=i2, j=j2, k=k2, flatshading=True, opacity=0.6, color=AVATAR_COLOR,
                          lighting=dict(ambient=0.6, diffuse=0.7, specular=0.2), scene='scene2')
             ]
         ))
@@ -811,6 +814,20 @@ def create_gradio_interface():
     custom_css = """
     .gradio-container { max-width: 1400px !important; }
     .example-row { margin-top: 15px; padding: 12px; background: #f8f9fa; border-radius: 6px; }
+    .example-word-label {
+        text-align: center;
+        font-size: 28px !important;
+        font-weight: bold !important;
+        color: #2c3e50 !important;
+        margin: 10px 0 !important;
+        padding: 10px !important;
+    }
+    .example-variant-label {
+        text-align: center;
+        font-size: 14px !important;
+        color: #7f8c8d !important;
+        margin-bottom: 10px !important;
+    }
     """
     
     example_list = list(_example_cache.values()) if _example_cache else []
@@ -857,10 +874,10 @@ def create_gradio_interface():
             for item in example_list:
                 word, pid = item['word'], item['pid']
                 with gr.Row(elem_classes="example-row"):
-                    with gr.Column(scale=1, min_width=120):
-                        gr.Markdown(f"**{word.capitalize()}**")
-                        gr.Markdown(f"Variant: {pid}")
-                        example_btn = gr.Button(f"Load", size="sm")
+                    with gr.Column(scale=1, min_width=180):
+                        gr.HTML(f'<div class="example-word-label">{word.upper()}</div>')
+                        gr.HTML(f'<div class="example-variant-label">Variant: {pid}</div>')
+                        example_btn = gr.Button("Load Example", size="sm", variant="secondary")
                     
                     with gr.Column(scale=3, min_width=500):
                         example_html = gr.HTML(