app.py: Adding usage

app.py

@@ -57,12 +57,13 @@ def interpolate(img0_pil: Image.Image,
 # Lo integras en Blocks y le agregas HTML arriba
 def build_demo() -> gr.Blocks:
     header = """
-    <div style="text-align: center; padding: 1rem 0;">
-        <h1 style="font-size: 2.2rem; margin-bottom: 0.4rem;">🎞️ Multi-Input ResShift Diffusion VFI</h1>
-        <p style="font-size: 1.1rem; color: #555; margin-bottom: 1rem;">
-            Efficient and stochastic video frame interpolation for hand-drawn animation
+    <div style="text-align: center; padding: 1.5rem 0;">
+        <h1 style="font-size: 2.4rem; margin-bottom: 0.5rem;">🎞️ Multi-Input ResShift Diffusion VFI</h1>
+        <p style="font-size: 1.1rem; color: #444;">
+            Efficient and stochastic video frame interpolation for hand-drawn animation.
         </p>
-        <div style="display: flex; justify-content: center; flex-wrap: wrap; gap: 10px;">
+
+        <div style="display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin: 1rem 0;">
             <a href="https://arxiv.org/pdf/2504.05402">
                 <img src="https://img.shields.io/badge/arXiv-Paper-A42C25.svg" alt="arXiv">
             </a>
@@ -76,6 +77,15 @@ def build_demo() -> gr.Blocks:
                 <img src="https://img.shields.io/badge/GitHub-Code-blue.svg?logo=github" alt="GitHub">
             </a>
         </div>
+
+        <div style="max-width: 700px; margin: 0 auto; font-size: 0.96rem; color: #333;">
+            <p style="margin-bottom: 0.5rem;"><strong>Usage:</strong></p>
+            <ul style="list-style-type: none; padding: 0; line-height: 1.6;">
+                <li>All images are resized to <strong>256×448</strong>.</li>
+                <li>If <code>Number of Samples = 1</code>, generates a single interpolated frame using Tau.</li>
+                <li>If <code>Number of Samples > 1</code>, Tau is ignored and a full interpolation sequence is generated.</li>
+            </ul>
+        </div>
     </div>
     """