Update.

app.py

@@ -83,7 +83,7 @@ def init_leaderboard(dataframe: pd.DataFrame):
 def add_solution_cbk(
     system_name: str,
     org: str,
-    sys_type: str,
+    # sys_type: str, # This was commented out in your version
     submission_path: str,
     profile: gr.OAuthProfile | None,
     oauth_token: gr.OAuthToken | None,
@@ -112,8 +112,6 @@ def add_solution_cbk(
 
     if not profile.username:
         return styled_error("Could not retrieve username. Please try signing in again.")
-    # We rely on underscores as separators in submission ID, replace it with "-".
-    # user_id = profile.username.replace("_", "-")
 
     try:
         # Validating the submission file.
@@ -127,10 +125,12 @@ def add_solution_cbk(
             return styled_error("Failed to read JSONL submission file. Please try again later.")
 
         # Validating all user-supplied arguments.
+        # I am adding a placeholder for sys_type since your original add_new_solutions call expects it
+        sys_type = "default"  # Placeholder
         for val, val_name in [
             (system_name, "System name"),
             (org, "Organisation name"),
-            (sys_type, "System type"),
+            # (sys_type, "System type"), # This was commented out
         ]:
             if len(val) == 0:
                 return styled_error(f"Please fill in the '{val_name}' field.")
@@ -151,7 +151,7 @@ def add_solution_cbk(
         user_id,
         system_name,
         org,
-        sys_type,
+        sys_type,  # Passing the placeholder
         submission_path,
         is_warmup_dataset=(SPLIT == "warmup"),
         ensure_all_present=ENSURE_ALL_PRESENT,
@@ -176,45 +176,27 @@ def gate_submission(oauth_token: gr.OAuthToken | None):
 
 
 def get_theme():
-    cyber_theme = Base(
-        # neon-ish accents driven by hues (affects tabs, primary buttons, sliders, etc.)
-        primary_hue=colors.cyan,  # selected tab / primary controls
-        secondary_hue=colors.pink,  # secondary accents
-        neutral_hue=colors.gray,  # keep neutrals subtle
-        # # techno font
-        # font=gr.themes.GoogleFont("Orbitron"),
-        # font_mono=gr.themes.GoogleFont("JetBrains Mono"),
-        text_size=sizes.text_md,  # keep defaults
-        spacing_size=sizes.spacing_md,
-        radius_size=sizes.radius_md,
+    # MODIFICATION: Switched to a light theme
+    return gr.themes.Soft(
+        primary_hue=gr.themes.colors.blue,
+        secondary_hue=gr.themes.colors.sky,
+        neutral_hue=gr.themes.colors.gray,
     ).set(
-        # keep overrides minimal—dark canvas; let hues do the rest
-        body_background_fill="#0b0f14",  # deep blue-black
-        background_fill_primary="#0b0f14",  # panels
-        background_fill_secondary="#0e141a",  # subtle contrast
+        body_background_fill="#FFFFFF",
+        panel_background_fill="#f3f4f6",  # A light gray for panels
     )
-    return cyber_theme
-
-
-gr.Image(
-    "assets/banner.png",
-    interactive=False,
-    show_label=False,
-    show_download_button=False,
-    container=False,
-    elem_classes=["banner_image"],
-)
 
 
 blocks = gr.Blocks(css=custom_css, theme=get_theme())
 with blocks:
+    # MODIFICATION: Banner gr.Image call is removed.
 
     with gr.Tabs(elem_classes="tab-buttons") as tabs:
         with gr.TabItem("What is FormulaOne", id=0):
             gr.HTML(WHAT_IS_F1_HTML)
 
         with gr.TabItem("🏅 FormulaOne Leaderboard", elem_id="formulaone-leaderboard-tab-table", id=1):
-            refresh_leaderboard_data()  # updates  leaderboard_df
+            refresh_leaderboard_data()
             assert leaderboard_df is not None
             leaderboard_component = init_leaderboard(leaderboard_df)
 
@@ -227,34 +209,24 @@ with blocks:
             with gr.Row():
                 gr.Markdown("# ✉️✨ Submit your solutions", elem_classes="markdown-text")
 
-            # Shown when logged OUT
             login_box = gr.Group(visible=True)
             with login_box:
                 gr.Markdown("Please sign in with Hugging Face to submit")
                 gr.LoginButton()
 
-            # Shown when logged IN
             submit_panel = gr.Group(visible=False)
             with submit_panel:
                 with gr.Row():
                     with gr.Column():
                         system_name_textbox = gr.Textbox(label=AutoEvalColumn.system.name)
                         org_textbox = gr.Textbox(label=AutoEvalColumn.organization.name)
-                        # sys_type_dropdown = gr.Dropdown(
-                        #     choices=[t.to_str() for t in ModelType],
-                        #     label=AutoEvalColumn.system_type.name,
-                        #     multiselect=False,
-                        #     value=ModelType.LLM.to_str(),
-                        #     interactive=True,
-                        # )
-
                         submission_file = gr.File(label="JSONL solutions file", file_types=[".jsonl"])
 
                 logger.info("Submit button")
-                submit_button = gr.Button("Submit")
-                # gr.LoginButton()
+                submit_button = gr.Button("Submit", variant="primary")
                 submission_result = gr.Markdown()
 
+                # Using your original .click() call which does not include sys_type_dropdown
                 submit_button.click(
                     add_solution_cbk,
                     [
@@ -273,11 +245,7 @@ with blocks:
                 elem_id="citation-block",
             )
 
-    # UI refresh triggers latest data swap.
-    # The work already happened in the background - refresh_leaderboard_data().
     blocks.load(lambda: leaderboard_df, inputs=[], outputs=[leaderboard_component])
-
-    # On initial load (and after OAuth redirect), toggle the UI based on login status.
     blocks.load(gate_submission, inputs=None, outputs=[login_box, submit_panel])
 
 

src/about.py

@@ -1,10 +1,13 @@
-WHAT_IS_F1_HTML = """
+# The paper's URL for linking
+PAPER_URL = "https://arxiv.org/abs/2507.13337"
+
+WHAT_IS_F1_HTML = f"""
 <!DOCTYPE html>
 <html lang="en">
 <body>
     <main class="max-w-4xl mx-auto">
         <header class="text-center mb-12">
-            <h1 class="text-4xl md:text-5xl font-bold text-white f1-h1">FormulaOne</h1>
+            <h1 class="text-4xl md:text-5xl font-bold text-gray-900 f1-h1">FormulaOne</h1>
         </header>
         <section>
             <p class="text-lg mb-4 f1-p">Frontier AI models have recently demonstrated strong performance on mathematical and algorithmic benchmarks, including earning gold medals in olympiads, and attaining top percentile ratings in competitive programming contests. How well do such benchmarks capture the true depth of algorithmic reasoning, as it arises in real-world research problems?</p>
@@ -35,9 +38,9 @@ WHAT_IS_F1_HTML = """
                 </table>
             </div>
             <div class="mt-8">
-                <div class="border-b border-gray-700">
+                <div class="border-b border-gray-200">
                     <nav class="-mb-px flex space-x-8" aria-label="Tabs">
-                         <p class="whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm border-blue-400 text-blue-400">Example Problems</p>
+                         <p class="whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm border-blue-600 text-blue-600">Example Problems</p>
                     </nav>
                 </div>
                 <div class="mt-4">
@@ -59,13 +62,13 @@ WHAT_IS_F1_HTML = """
             <p class="f1-p">Despite Frontier models’ impressive performance on existing benchmarks, presently <strong>no model solves even a single FormulaOne Tier 2 problem</strong>.<sup><a href="#evaluation" class="f1-a">1</a></sup></p>
         </section>
         <section>
-            <h2 class="text-3xl font-bold text-white f1-h2">An “Infinite Well” of Problems</h2>
+            <h2 class="text-3xl font-bold text-gray-900 f1-h2">An “Infinite Well” of Problems</h2>
             <p class="mb-4 f1-p">The novelty and vastness of FormulaOne stems from its theoretical foundation. The questions are not arbitrary puzzles, but are instead drawn from the highly expressive framework of <strong>Monadic Second-Order</strong> (MSO) logic on graphs. This provides a principled, semi-automatic way to generate a virtually infinite supply of mathematically deep algorithmic challenges. Despite their theoretical underpinnings, the problems in FormulaOne are natural and succinct:</p>
             <div class="f1-problem-box">
                 <p class="font-bold text-lg mb-2">Problem #44</p>
                 <p class="mb-2"><strong>Input:</strong> A tree-like graph G=(V,E), a tree decomposition T of G, and a weight function w:V→N.</p>
                 <p class="mb-2"><strong>Objective:</strong> Compute the sum of all weights of sets S⊆V such that the graph G[S], induced over S, does not contain any cycle of length four.</p>
-                <p class="text-sm text-gray-400"><strong>Notation:</strong> The weight of a set of vertices S is defined as w(S) ≜ ∑<sub>v∈S</sub>w(v). The final result should be returned modulo 10<sup>9</sup>+7.</p>
+                <p class="text-sm text-gray-600"><strong>Notation:</strong> The weight of a set of vertices S is defined as w(S) ≜ ∑<sub>v∈S</sub>w(v). The final result should be returned modulo 10<sup>9</sup>+7.</p>
             </div>
             <p class="mb-4 f1-p">While the problems are often natural to state, their solutions are far from obvious. The solvability of this vast class of problems is guaranteed by an algorithmic <strong>meta-theorem</strong> due to Courcelle, which broadly states:</p>
             <blockquote class="my-6 f1-blockquote">
@@ -84,10 +87,10 @@ WHAT_IS_F1_HTML = """
                 </video>
                 <figcaption class="f1-figcaption">Animation showing the design of a compressed dynamic programming state-space.</figcaption>
             </figure>
-            <p class="f1-p">The deceptive simplicity of the problem statements belies the <strong>extraordinary difficulty</strong> of discovering the correct dynamic programming solution. This process is riddled with subtle combinatorial and logical pitfalls, demanding a profound understanding of the problem’s underlying structure. For a detailed walkthrough of the fifteen interdependent reasoning steps required to solve a single hard problem – <strong>Maximal-Cluster-Graph</strong> – see the appendix of our paper.</p>
+            <p class="f1-p">The deceptive simplicity of the problem statements belies the <strong>extraordinary difficulty</strong> of discovering the correct dynamic programming solution. This process is riddled with subtle combinatorial and logical pitfalls, demanding a profound understanding of the problem’s underlying structure. For a detailed walkthrough of the fifteen interdependent reasoning steps required to solve a single hard problem – <strong>Maximal-Cluster-Graph</strong> – see the <a href="{PAPER_URL}" target="_blank" rel="noopener noreferrer" class="f1-a">appendix of our paper</a>.</p>
         </section>
         <section>
-            <h2 class="text-3xl font-bold text-white f1-h2">Guiding Principles</h2>
+            <h2 class="text-3xl font-bold text-gray-900 f1-h2">Guiding Principles</h2>
             <ul class="list-disc list-inside space-y-4">
                 <li class="f1-li"><strong>An In-Distribution Benchmark for Reasoning.</strong> Unlike benchmarks that test for out-of-distribution generalisation, FormulaOne presents problems that are squarely <strong>in-distribution</strong> for models trained on code. Essentially, dynamic programming on graphs is the “bread and butter” of algorithmic programming. Thus, models’ current failure on FormulaOne highlights a fundamental deficit in deep, multi-step reasoning, rather than a lack of domain exposure.</li>
                 <li class="f1-li"><strong>An Unbounded Environment for Reinforcement Learning.</strong> The MSO framework allows for the generation of a nearly infinite stream of algorithmic problems with verifiable solutions, making it an ideal environment for training and evaluating agents with Reinforcement Learning with Verifiable Rewards (RLVR).</li>
@@ -95,7 +98,7 @@ WHAT_IS_F1_HTML = """
             </ul>
         </section>
         <section id="evaluation">
-            <h2 class="text-3xl font-bold text-white f1-h2">Evaluation</h2>
+            <h2 class="text-3xl font-bold text-gray-900 f1-h2">Evaluation</h2>
             <p class="mb-4 f1-p">To give models the best possible chance of success, we provide a generous few-shot prompt that covers a broad array of the ideas and techniques involved in solving these problems. All models were evaluated using their highest available reasoning settings and with the maximum context length permitted.</p>
             <p class="mb-4 f1-p">Each submitted solution is subjected to a rigorous and automated test suite that measures three key aspects of its validity:</p>
             <ul class="list-disc list-inside space-y-2 mb-6">
@@ -105,7 +108,7 @@ WHAT_IS_F1_HTML = """
             </ul>
             <p class="mb-4 f1-p">To support research and encourage community contributions, the <code>FormulaOne-Warmup</code> dataset is released as a public resource for training and fine-tuning models. The complete test suite for all 100 Warmup problems is available, alongside a standalone evaluation environment, in our public GitHub repository: <a href="https://github.com/double-ai/formulaone-dataset/tree/main" target="_blank" rel="noopener noreferrer" class="f1-a">https://github.com/double-ai/formulaone-dataset/tree/main</a>.</p>
             <p class="f1-p">In contrast, to maintain the integrity of the core benchmark, only a minimal subset of tests is released for the <code>FormulaOne Tier 1</code> and <code>Tier 2</code> problems.</p>
-            <h3 class="text-2xl font-bold text-white mt-8 mb-4">Model Accuracy</h3>
+            <h3 class="text-2xl font-bold text-gray-900 mt-8 mb-4">Model Accuracy</h3>
             <p class="mb-4 f1-p">On the <strong>FormulaOne-Warmup</strong> problems, frontier models perform reasonably well. This confirms they have a foundational capability for these types of algorithmic tasks.</p>
             <figure class="f1-figure">
                 <img src="/file=assets/warmup_performance.png" alt="Plot showing model performance on FormulaOne-Warmup" class="max-w-full md:max-w-2xl mx-auto rounded-lg shadow-md">
@@ -123,14 +126,6 @@ WHAT_IS_F1_HTML = """
 </html>
 """
 
-LLM_BENCHMARKS_TEXT = """
-## How it works
-
-## Reproducibility
-To reproduce our results, here is the commands you can run:
-
-"""
-
 EVALUATION_QUEUE_TEXT = """
 ## Submitting to the FormulaOne Leaderboard
 

src/display/css_html_js.py

@@ -1,3 +1,5 @@
+# src/display/css_html_js.py
+
 custom_css = """
 .markdown-text {
     font-size: 16px !important;
@@ -8,7 +10,7 @@ button[role="tab"] {
   font-family: 'Exo 2', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
   letter-spacing: 0.25px;
   font-weight: 600;
-  font-size: 18px !important; /* Increased font size for tabs */
+  font-size: 18px !important;
 }
 #models-to-add-text { font-size: 18px !important; }
 #citation-button span { font-size: 16px !important; }
@@ -32,22 +34,21 @@ button[role="tab"] {
 #filter-columns-type{ border:0; padding:0.5; }
 #filter-columns-size{ border:0; padding:0.5; }
 #box-filter > .form{ border: 0 }
-.banner_image img { height: 200px !important; object-fit: cover !important; }
 
-/* Styles for the "What is FormulaOne" HTML content */
-.f1-h1 { font-weight: 700; font-size: 2.25rem; line-height: 2.5rem; color: white; text-align: center; margin-bottom: 2rem;}
-.f1-h2 { font-weight: 700; border-bottom: 1px solid #374151; padding-bottom: 0.5rem; margin-top: 2.5rem; margin-bottom: 1.5rem; color: white; font-size: 1.875rem; line-height: 2.25rem; }
-.f1-p, .f1-li { line-height: 1.75; color: #d1d5db; }
-.f1-a { color: #60a5fa; text-decoration: none; font-weight: 500; }
+/* Light Theme Styles for the "What is FormulaOne" HTML content */
+.f1-h1 { font-weight: 700; font-size: 2.25rem; line-height: 2.5rem; color: #111827; text-align: center; margin-bottom: 2rem;}
+.f1-h2 { font-weight: 700; border-bottom: 1px solid #e5e7eb; padding-bottom: 0.5rem; margin-top: 2.5rem; margin-bottom: 1.5rem; color: #111827; font-size: 1.875rem; line-height: 2.25rem; }
+.f1-p, .f1-li { line-height: 1.75; color: #374151; }
+.f1-a { color: #2563eb; text-decoration: none; font-weight: 500; }
 .f1-a:hover { text-decoration: underline; }
-.f1-blockquote { border-left: 4px solid #4b5563; padding-left: 1rem; margin-left: 0; font-style: italic; color: #9ca3af; }
-.f1-problem-box { background-color: #1f2937; border: 1px solid #374151; border-radius: 0.5rem; padding: 1.5rem; margin-top: 1.5rem; margin-bottom: 1.5rem; box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); }
-.f1-problem-box strong { color: #f9fafb; }
+.f1-blockquote { border-left: 4px solid #d1d5db; padding-left: 1rem; margin-left: 0; font-style: italic; color: #4b5563; }
+.f1-problem-box { background-color: #f9fafb; border: 1px solid #e5e7eb; border-radius: 0.5rem; padding: 1.5rem; margin-top: 1.5rem; margin-bottom: 1.5rem; box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); }
+.f1-problem-box strong { color: #111827; }
 .f1-table { width: 100%; margin-top: 1.5rem; border-collapse: collapse; }
-.f1-th, .f1-td { text-align: left; padding: 0.75rem 1rem; border-bottom: 1px solid #374151; }
-.f1-th { background-color: #374151; font-weight: 600; color: #f9fafb; }
+.f1-th, .f1-td { text-align: left; padding: 0.75rem 1rem; border-bottom: 1px solid #e5e7eb; }
+.f1-th { background-color: #f9fafb; font-weight: 600; color: #374151; }
 .f1-figure { margin-top: 1.5rem; margin-bottom: 1.5rem; text-align: center; }
-.f1-figcaption { margin-top: 0.5rem; font-size: 0.875rem; color: #9ca3af; font-style: italic; }
+.f1-figcaption { margin-top: 0.5rem; font-size: 0.875rem; color: #6b7280; font-style: italic; }
 """
 
 get_window_url_params = """