Update app.py

app.py

@@ -388,7 +388,7 @@ display:flex;
     padding: 12px 15px;
     font-size: 1em;
     border: 2px solid #d3bce8;
-    bordar-color: #5e1287;
+    border-color: #5e1287;
     border-radius: 8px;
     box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.05);
     transition: border-color 0.3s ease;
@@ -501,45 +501,45 @@ with gr.Blocks(css=css_tech_theme) as demo:
         with gr.TabItem("📖 Overview"):
             gr.Markdown("""
             <div class="tabs">
-        <h2 style="color: #6a1b9a; text-align: center;">About the Competition</h2>
-        <p>The <strong>Mobile-MMLU Benchmark Competition</strong> is a premier challenge designed to evaluate and advance mobile-optimized Large Language Models (LLMs). This competition is an excellent opportunity to showcase your model's ability to handle real-world scenarios and excel in mobile intelligence.</p>
-        <p>With a dataset spanning <strong>80 distinct fields</strong> and featuring <strong>16,186 questions</strong>, the competition emphasizes practical applications, from education and healthcare to technology and daily life.</p>
-        
-        <h3 style="color: #8e44ad;">Why Compete?</h3>
-        <p>Participating in this competition allows you to:</p>
-        <ul>
-            <li>🌟 Showcase your expertise in developing and optimizing LLMs for mobile platforms.</li>
-            <li>🚀 Benchmark your model’s performance against others in a highly competitive environment.</li>
-            <li>📈 Contribute to advancements in mobile AI, shaping the future of user-centric AI systems.</li>
-        </ul>
-        
-        <h3 style="color: #6a1b9a;">How It Works</h3>
-        <ol>
-            <li>1️⃣ <strong>Download the Dataset:</strong> Access the dataset and detailed instructions on the <a href="https://github.com/your-github-repo" target="_blank">GitHub page</a>. Follow the steps to ensure your environment is set up correctly.</li>
-            <li>2️⃣ <strong>Generate Predictions:</strong> Use the provided script in the GitHub repository to generate answers. Ensure the output file matches the following format:</li>
-        </ol>
-        <pre style="background-color: #f9f7fd; border: 1px solid #d3bce8; border-radius: 8px; padding: 10px;">
-question_id,predicted_answer
-q1,A
-q2,B
-q3,C
-...
-        </pre>
-        <p>The <code>question_id</code> is the unique identifier for each question, and <code>predicted_answer</code> is your model's prediction (A, B, C, or D).</p>
-        
-        <ol start="3">
-            <li>3️⃣ <strong>Submit Predictions:</strong> Upload your CSV file to the <strong>Submission Page</strong> on this platform.</li>
-            <li>4️⃣ <strong>Evaluation:</strong> Your submission will be scored based on accuracy. The results will include overall and valid accuracy metrics.</li>
-            <li>5️⃣ <strong>Leaderboard:</strong> Optionally, add your results to the real-time leaderboard to compare your model's performance with others.</li>
-        </ol>
+            <h2 style="color: #6a1b9a; text-align: center;">About the Competition</h2>
+            <p>The <strong>Mobile-MMLU Benchmark Competition</strong> is a premier challenge designed to evaluate and advance mobile-optimized Large Language Models (LLMs). This competition is an excellent opportunity to showcase your model's ability to handle real-world scenarios and excel in mobile intelligence.</p>
+            <p>With a dataset spanning <strong>80 distinct fields</strong> and featuring <strong>16,186 questions</strong>, the competition emphasizes practical applications, from education and healthcare to technology and daily life.</p>
+            
+            <h3 style="color: #8e44ad;">Why Compete?</h3>
+            <p>Participating in this competition allows you to:</p>
+            <ul>
+                <li>🌟 Showcase your expertise in developing and optimizing LLMs for mobile platforms.</li>
+                <li>🚀 Benchmark your model’s performance against others in a highly competitive environment.</li>
+                <li>📈 Contribute to advancements in mobile AI, shaping the future of user-centric AI systems.</li>
+            </ul>
         
-        <h3 style="color: #8e44ad;">Resources</h3>
-        <ul>
-            <li>📂 <a href="https://github.com/your-github-repo" target="_blank">GitHub Repository</a>: Contains the dataset, scripts, and detailed instructions.</li>
-            <li>📊 <a href="https://github.com/your-dataset-link" target="_blank">Dataset Link</a>: Direct access to the competition dataset.</li>
-            <li>❓ <a href="https://github.com/your-github-repo/issues" target="_blank">Support Page</a>: Use this for queries or issues during participation.</li>
-        </ul>
-        </div>
+            <h3 style="color: #6a1b9a;">How It Works</h3>
+            <ol>
+                <li>1️⃣ <strong>Download the Dataset:</strong> Access the dataset and detailed instructions on the <a href="https://github.com/your-github-repo" target="_blank">GitHub page</a>. Follow the steps to ensure your environment is set up correctly.</li>
+                <li>2️⃣ <strong>Generate Predictions:</strong> Use the provided script in the GitHub repository to generate answers. Ensure the output file matches the following format:</li>
+            </ol>
+            <pre style="background-color: #f9f7fd; border: 1px solid #d3bce8; border-radius: 8px; padding: 10px;">
+    question_id,predicted_answer
+    q1,A
+    q2,B
+    q3,C
+    ...
+            </pre>
+            <p>The <code>question_id</code> is the unique identifier for each question, and <code>predicted_answer</code> is your model's prediction (A, B, C, or D).</p>
+            
+            <ol start="3">
+                <li>3️⃣ <strong>Submit Predictions:</strong> Upload your CSV file to the <strong>Submission Page</strong> on this platform.</li>
+                <li>4️⃣ <strong>Evaluation:</strong> Your submission will be scored based on accuracy. The results will include overall and valid accuracy metrics.</li>
+                <li>5️⃣ <strong>Leaderboard:</strong> Optionally, add your results to the real-time leaderboard to compare your model's performance with others.</li>
+            </ol>
+            
+            <h3 style="color: #8e44ad;">Resources</h3>
+            <ul>
+                <li>📂 <a href="https://github.com/your-github-repo" target="_blank">GitHub Repository</a>: Contains the dataset, scripts, and detailed instructions.</li>
+                <li>📊 <a href="https://github.com/your-dataset-link" target="_blank">Dataset Link</a>: Direct access to the competition dataset.</li>
+                <li>❓ <a href="https://github.com/your-github-repo/issues" target="_blank">Support Page</a>: Use this for queries or issues during participation.</li>
+            </ul>
+            </div>
             """)
             
         with gr.TabItem("📤 Submission"):