V1

data_loader.py

@@ -44,14 +44,15 @@ def load_data():
     
     return df
 
-# Color palette matching DocumentProcessing style
+# Nutrient brand color palette
 COLORS = {
     # Light mode colors
     "white": "#FFFFFF",
+    "black": "#000000",
     "disc_pink": "#DE9DCC", 
     "code_coral": "#F25E45",
     "data_green": "#6EB579",
-    "digital_pollen": "#F0C968",
+    "digital_pollen": "#F0C968",  # Primary yellow accent
     "warm_black": "#1A1414",
     "off_white": "#EFEBE7",
     "pixel_mist": "#E2DBD9", 
@@ -69,7 +70,7 @@ COLORS = {
 HEADER_CONTENT = f"""
 <style>
 /* Import fonts */
-@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700;800&display=swap');
 
 /* Root variables with custom color palette */
 :root {{
@@ -82,18 +83,18 @@ HEADER_CONTENT = f"""
     --text-primary: #EFEBE7;
     --text-secondary: #C2B8AE;
     --text-muted: #67594B;
-    --accent-primary: #DE9DCC;
+    --accent-primary: #F0C968;
     --accent-secondary: #F25E45;
     --accent-tertiary: #6EB579;
-    --accent-quaternary: #F0C968;
-    --glow-primary: rgba(222, 157, 204, 0.4);
+    --accent-quaternary: #DE9DCC;
+    --glow-primary: rgba(240, 201, 104, 0.4);
     --glow-secondary: rgba(242, 94, 69, 0.4);
     --glow-tertiary: rgba(110, 181, 121, 0.4);
 }}
 
 /* Global font and background */
 .gradio-container {{
-    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
+    font-family: 'Archivo', -apple-system, BlinkMacSystemFont, sans-serif !important;
     background: var(--bg-primary) !important;
     color: var(--text-primary) !important;
 }}
@@ -102,12 +103,12 @@ HEADER_CONTENT = f"""
 h1, h2, h3, h4 {{
     color: var(--text-primary) !important;
     font-weight: 700 !important;
-    font-family: 'Inter', sans-serif !important;
+    font-family: 'Archivo', sans-serif !important;
 }}
 
 p, span, div {{
     color: var(--text-primary) !important;
-    font-family: 'Inter', sans-serif !important;
+    font-family: 'Archivo', sans-serif !important;
 }}
 
 /* Dark containers */
@@ -148,24 +149,25 @@ p, span, div {{
 .v2-styled-table {{
     width: 100%;
     border-collapse: collapse;
-    font-family: 'Inter', sans-serif;
+    font-family: 'Archivo', sans-serif;
     font-size: 14px;
 }}
 
 .v2-styled-table thead {{
-    background: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
+    background: var(--accent-primary);
 }}
 
 .v2-styled-table th {{
     padding: 16px 12px;
     text-align: left;
-    color: white;
+    color: #000000 !important;
     font-weight: 600;
     font-size: 13px;
     text-transform: uppercase;
     letter-spacing: 0.05em;
     border: none;
     position: relative;
+    font-family: 'Archivo', sans-serif;
 }}
 
 .v2-styled-table td {{
@@ -176,26 +178,27 @@ p, span, div {{
     vertical-align: middle;
 }}
 
-.v2-styled-table tbody tr {{
-    transition: all 0.3s ease;
-    background: var(--bg-secondary);
-}}
+    .v2-styled-table tbody tr {{
+        transition: none;
+        background: rgba(239, 235, 231, 0.06);
+        box-shadow: none;
+    }}
 
-.v2-styled-table tbody tr:nth-child(even) {{
-    background: var(--bg-card);
-}}
+    .v2-styled-table tbody tr:nth-child(even) {{
+        background: rgba(239, 235, 231, 0.08);
+    }}
 
-.v2-styled-table tbody tr:hover {{
-    background: rgba(222, 157, 204, 0.1);
-    box-shadow: 0 0 20px var(--glow-primary);
-    transform: scale(1.01);
-}}
+    .v2-styled-table tbody tr:hover {{
+        background: rgba(240, 201, 104, 0.10);
+        box-shadow: none;
+        transform: none;
+    }}
 
-.model-name {{
-    font-weight: 600;
-    color: var(--accent-primary);
-    transition: all 0.2s ease;
-}}
+    .model-name {{
+        font-weight: 700;
+        color: var(--off_white);
+        transition: all 0.2s ease;
+    }}
 
 .numeric-cell {{
     text-align: center;
@@ -205,6 +208,7 @@ p, span, div {{
 
 .score-cell {{
     padding: 8px 12px;
+    color: #000000 !important;
 }}
 
 /* Scrollbar styling */
@@ -238,14 +242,20 @@ p, span, div {{
 ">
     <div style="max-width: 72rem; margin: 0 auto;">
         <div style="text-align: center; margin-bottom: 4rem;">
+            <!-- Nutrient Logo -->
+            <div style="margin-bottom: 2rem; display: flex; justify-content: center;">
+                <svg width="120" height="84" viewBox="0 0 240 169" xmlns="http://www.w3.org/2000/svg">
+                    <path fill="#FFFFFF" d="M20,104.3c-11.1,0-20-8.9-20-20s8.9-20,20-20,20,8.9,20,20-9,20-20,20ZM220,64.3c-11.1,0-20,8.9-20,20s8.9,20,20,20,20-8.9,20-20-8.9-20-20-20ZM30.5,133.2c-8.5,7.1-9.6,19.7-2.5,28.2,7.1,8.5,19.7,9.6,28.2,2.5,8.5-7.1,9.6-19.7,2.5-28.2-7.1-8.5-19.7-9.6-28.2-2.5ZM209.5,35.3c8.5-7.1,9.6-19.7,2.5-28.2-7.1-8.5-19.7-9.6-28.2-2.5-8.5,7.1-9.6,19.7-2.5,28.2,7.1,8.5,19.7,9.6,28.2,2.5ZM56.2,4.7c-8.5-7.1-21.1-6-28.2,2.5-7.1,8.5-6,21.1,2.5,28.2,8.5,7.1,21.1,6,28.2-2.5,7.1-8.5,6-21.1-2.5-28.2ZM209.5,133.2c-8.5-7.1-21.1-6-28.2,2.5-7.1,8.5-6,21.1,2.5,28.2,8.5,7.1,21.1,6,28.2-2.5,7.1-8.5,6-21.1-2.5-28.2ZM158.4,90.4c-8.5-7.1-21.1-6-28.2,2.5-7.1,8.5-6,21.1,2.5,28.2,8.5,7.1,21.1,6,28.2-2.5s6-21.1-2.5-28.2ZM107.3,47.5c-8.5-7.1-21.1-6-28.2,2.5-7.1,8.5-6,21.1,2.5,28.2,8.5,7.1,21.1,6,28.2-2.5s6-21.1-2.5-28.2Z"/>
+                </svg>
+            </div>
+            
             <h1 style="
                 font-size: 4rem;
                 font-weight: 800;
                 line-height: 1.1;
-                background: linear-gradient(45deg, var(--accent-primary), var(--accent-secondary));
-                -webkit-background-clip: text;
-                -webkit-text-fill-color: transparent;
+                color: var(--accent-primary);
                 margin-bottom: 0.5rem;
+                font-family: 'Archivo', sans-serif;
             ">
                 🔒 LLM PII Detection Leaderboard
             </h1>
@@ -261,13 +271,12 @@ p, span, div {{
                 Comprehensive benchmark for language models' performance in detecting and redacting 
                 personally identifiable information (PII) across various document types and scenarios.
                 <span style="
-                    background: linear-gradient(to right, var(--accent-tertiary), var(--accent-quaternary));
-                    -webkit-background-clip: text;
-                    -webkit-text-fill-color: transparent;
+                    color: var(--accent-primary);
                     display: block;
                     margin-top: 1rem;
                     font-size: 1.5rem;
                     font-weight: 500;
+                    font-family: 'Archivo', sans-serif;
                 ">
                     "How well do LLMs protect sensitive information?"
                 </span>
@@ -292,18 +301,17 @@ p, span, div {{
                     font-size: 4rem;
                     font-weight: 800;
                     margin-bottom: 1rem;
-                    background: linear-gradient(45deg, var(--accent-primary), var(--accent-secondary));
-                    -webkit-background-clip: text;
-                    -webkit-text-fill-color: transparent;
-                ">8</div>
+                    color: var(--accent-primary);
+                    font-family: 'Archivo', sans-serif;
+                ">4</div>
                 <div style="color: var(--text-secondary); font-size: 1.5rem; margin-bottom: 1.5rem;">
                     Language Models
                 </div>
                 <div style="font-size: 1.125rem; line-height: 1.75; color: var(--text-primary);">
-                    Leading proprietary & open source
+                    Cutting-edge Nutrient models
                 </div>
                 <div style="color: var(--text-secondary); margin-top: 0.5rem;">
-                    GPT-4o, Claude, Gemini, LLaMA, Mistral
+                    GPT-5-mini, GPT-5-nano, GPT-4.1-mini, GPT-4.1-nano
                 </div>
             </div>
 
@@ -319,9 +327,8 @@ p, span, div {{
                     font-size: 4rem;
                     font-weight: 800;
                     margin-bottom: 1rem;
-                    background: linear-gradient(45deg, var(--accent-tertiary), var(--accent-quaternary));
-                    -webkit-background-clip: text;
-                    -webkit-text-fill-color: transparent;
+                    color: var(--accent-tertiary);
+                    font-family: 'Archivo', sans-serif;
                 ">5</div>
                 <div style="color: var(--text-secondary); font-size: 1.5rem; margin-bottom: 1.5rem;">
                     Document Types
@@ -346,18 +353,17 @@ p, span, div {{
                     font-size: 4rem;
                     font-weight: 800;
                     margin-bottom: 1rem;
-                    background: linear-gradient(45deg, var(--accent-secondary), var(--accent-primary));
-                    -webkit-background-clip: text;
-                    -webkit-text-fill-color: transparent;
-                ">94.1%</div>
+                    color: var(--accent-primary);
+                    font-family: 'Archivo', sans-serif;
+                ">98.0%</div>
                 <div style="color: var(--text-secondary); font-size: 1.5rem; margin-bottom: 1.5rem;">
-                    Best Accuracy
+                    Best F1 Score
                 </div>
                 <div style="font-size: 1.125rem; line-height: 1.75; color: var(--text-primary);">
                     State-of-the-art performance
                 </div>
                 <div style="color: var(--text-secondary); margin-top: 0.5rem;">
-                    GPT-4o leading precision & recall
+                    Nutrient & GPT-5-mini leading F1 performance
                 </div>
             </div>
         </div>
@@ -369,8 +375,7 @@ p, span, div {{
 METHODOLOGY = """
 <div style="max-width: 1200px; margin: 0 auto; padding: 2rem; color: var(--text-secondary); line-height: 1.7; font-size: 1rem;">
     <h1 style="font-size: 2.5rem; font-weight: 700; margin: 3rem 0 1.5rem; color: var(--text-primary); 
-               background: linear-gradient(to right, var(--accent-primary), var(--accent-secondary)); 
-               -webkit-background-clip: text; -webkit-text-fill-color: transparent;">
+               font-family: 'Archivo', sans-serif;">
         Methodology
     </h1>
     
@@ -384,28 +389,28 @@ METHODOLOGY = """
         <li style="padding-left: 2rem; position: relative; margin: 1rem 0; display: flex; align-items: flex-start;">
             <span style="content: ''; position: absolute; left: 0; top: 0.75rem; width: 8px; height: 8px; 
                          background: var(--accent-primary); border-radius: 50%; 
-                         box-shadow: 0 0 0 2px rgba(222, 157, 204, 0.2);"></span>
+                         box-shadow: 0 0 0 2px rgba(240, 201, 104, 0.25);"></span>
             <span style="color: var(--accent-primary); font-weight: 600;">Model Selection:</span> 
             We evaluate leading language models across proprietary and open-source categories
         </li>
         <li style="padding-left: 2rem; position: relative; margin: 1rem 0; display: flex; align-items: flex-start;">
             <span style="content: ''; position: absolute; left: 0; top: 0.75rem; width: 8px; height: 8px; 
                          background: var(--accent-primary); border-radius: 50%; 
-                         box-shadow: 0 0 0 2px rgba(222, 157, 204, 0.2);"></span>
+                         box-shadow: 0 0 0 2px rgba(240, 201, 104, 0.25);"></span>
             <span style="color: var(--accent-primary); font-weight: 600;">PII Detection:</span> 
             Each model processes documents with instructions to identify and classify PII entities
         </li>
         <li style="padding-left: 2rem; position: relative; margin: 1rem 0; display: flex; align-items: flex-start;">
             <span style="content: ''; position: absolute; left: 0; top: 0.75rem; width: 8px; height: 8px; 
                          background: var(--accent-primary); border-radius: 50%; 
-                         box-shadow: 0 0 0 2px rgba(222, 157, 204, 0.2);"></span>
+                         box-shadow: 0 0 0 2px rgba(240, 201, 104, 0.25);"></span>
             <span style="color: var(--accent-primary); font-weight: 600;">Performance Metrics:</span> 
             Precision, Recall, F1 Score, Over-detection Rate, Processing Time, and Cost
         </li>
         <li style="padding-left: 2rem; position: relative; margin: 1rem 0; display: flex; align-items: flex-start;">
             <span style="content: ''; position: absolute; left: 0; top: 0.75rem; width: 8px; height: 8px; 
                          background: var(--accent-primary); border-radius: 50%; 
-                         box-shadow: 0 0 0 2px rgba(222, 157, 204, 0.2);"></span>
+                         box-shadow: 0 0 0 2px rgba(240, 201, 104, 0.25);"></span>
             <span style="color: var(--accent-primary); font-weight: 600;">Domain Analysis:</span> 
             Specialized evaluation across Healthcare, Financial, Government, Legal, and Personal documents
         </li>
@@ -424,5 +429,22 @@ METHODOLOGY = """
             <li style="margin: 1rem 0;"><span style="color: var(--accent-secondary); font-weight: 600;">Over-detection Rate:</span> Percentage of non-PII incorrectly flagged (lower is better)</li>
         </ul>
     </div>
+    
+    <!-- Footer -->
+    <div style="
+        text-align: center;
+        margin-top: 3rem;
+        padding-top: 2rem;
+        border-top: 1px solid var(--border-subtle);
+    ">
+        <p style="
+            color: var(--text-secondary);
+            font-size: 1rem;
+            font-family: 'Archivo', sans-serif;
+            font-weight: 500;
+        ">
+            Powered by <a href="https://nutrient.io" target="_blank" rel="noopener noreferrer" style="color: var(--accent-primary); font-weight: 700; text-decoration: none;">Nutrient</a>
+        </p>
+    </div>
 </div>
 """ 

pii_leaderboard.py

@@ -14,13 +14,13 @@ from data_loader import (
 def get_rank_badge(rank):
     """Generate HTML for rank badge with appropriate styling"""
     badge_styles = {
-        1: ("1st", f"linear-gradient(145deg, {COLORS['digital_pollen']}, {COLORS['digital_pollen']})", COLORS['warm_black']),
-        2: ("2nd", f"linear-gradient(145deg, {COLORS['soft_grey']}, {COLORS['warm_grey']})", COLORS['white']),
-        3: ("3rd", f"linear-gradient(145deg, {COLORS['code_coral']}, {COLORS['code_coral_dm']})", COLORS['white']),
+        1: ("1st", COLORS['digital_pollen'], COLORS['warm_black']),
+        2: ("2nd", COLORS['soft_grey'], COLORS['black']),
+        3: ("3rd", COLORS['code_coral'], COLORS['black']),
     }
 
     if rank in badge_styles:
-        label, gradient, text_color = badge_styles[rank]
+        label, bg_color, text_color = badge_styles[rank]
         return f"""
             <div style="
                 display: inline-flex;
@@ -28,12 +28,13 @@ def get_rank_badge(rank):
                 justify-content: center;
                 min-width: 48px;
                 padding: 4px 12px;
-                background: {gradient};
-                color: {text_color};
+                background: {bg_color};
+                color: {text_color} !important;
                 border-radius: 6px;
                 font-weight: 600;
                 font-size: 0.9em;
                 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
+                font-family: 'Archivo', sans-serif;
             ">
                 {label}
             </div>
@@ -53,17 +54,20 @@ def get_rank_badge(rank):
 
 def get_type_badge(model_type):
     """Generate HTML for model type badge"""
-    bg_color = COLORS['disc_pink'] if model_type == 'Proprietary' else COLORS['data_green']
+    bg_color = COLORS['digital_pollen'] if model_type == 'Proprietary' else COLORS['data_green']
+    # Use black text for better readability on brand accent backgrounds
+    text_color = '#000000'
     return f"""
         <div style="
             display: inline-flex;
             align-items: center;
             padding: 4px 8px;
             background: {bg_color};
-            color: white;
+            color: {text_color} !important;
             border-radius: 4px;
             font-size: 0.85em;
-            font-weight: 500;
+            font-weight: 600;
+            font-family: 'Archivo', sans-serif;
         ">
             {model_type}
         </div>
@@ -80,9 +84,9 @@ def get_score_bar(score, is_inverse=False):
     
     # For over-detection rate, use inverse coloring (lower is better)
     if is_inverse:
-        gradient = f"linear-gradient(90deg, {COLORS['data_green']}, {COLORS['code_coral']})"
+        bar_color = COLORS['code_coral'] if score > 0.5 else COLORS['data_green']
     else:
-        gradient = f"linear-gradient(90deg, {COLORS['code_coral']}, {COLORS['data_green']})"
+        bar_color = COLORS['data_green'] if score > 0.5 else COLORS['code_coral']
     
     return f"""
         <div style="display: flex; align-items: center; gap: 12px; width: 100%;">
@@ -97,15 +101,15 @@ def get_score_bar(score, is_inverse=False):
                 <div style="
                     width: {width}%;
                     height: 100%;
-                    background: {gradient};
+                    background: {bar_color};
                     border-radius: 4px;
                     transition: width 0.3s ease;
                 "></div>
             </div>
             <span style="
                 font-family: 'SF Mono', monospace;
-                font-weight: 600;
-                color: var(--text-primary);
+                font-weight: 700;
+                color: #000000;
                 min-width: 60px;
             ">{score:.3f}</span>
         </div>
@@ -126,16 +130,16 @@ def create_pii_leaderboard():
                 <thead>
                     <tr>
                         <th style="width: 80px;">Rank</th>
-                        <th>Model</th>
-                        <th style="width: 120px;">Type</th>
-                        <th>Vendor</th>
-                        <th style="width: 200px;">Overall Accuracy</th>
-                        <th style="width: 150px;">Precision</th>
-                        <th style="width: 150px;">Recall</th>
+                        <th style="width: 250px;">Model</th>
                         <th style="width: 150px;">F1 Score</th>
+                        <th style="width: 150px;">Recall</th>
+                        <th style="width: 150px;">Precision</th>
+                        <th style="width: 200px;">Overall Accuracy</th>
                         <th style="width: 160px;">Over-detection Rate</th>
                         <th>Cost/Doc ($)</th>
                         <th>Time (s)</th>
+                        <th style="width: 120px;">Type</th>
+                        <th>Vendor</th>
                     </tr>
                 </thead>
                 <tbody>
@@ -147,9 +151,7 @@ def create_pii_leaderboard():
             table_html += f"""
                 <tr>
                     <td>{get_rank_badge(rank)}</td>
-                    <td class="model-name">{row['Model']}</td>
-                    <td>{get_type_badge(row['Model Type'])}</td>
-                    <td>{row['Vendor']}</td>
+                    <td class="model-name" style="color:#EFEBE7; font-weight:700;">{row['Model']}</td>
             """
             
             # Get appropriate values based on document type filter
@@ -168,24 +170,24 @@ def create_pii_leaderboard():
             cost = row.get('Cost per Document ($)', '')
             time = row.get('Processing Time (s)', '')
             
-            # Add score bars
-            if accuracy != '':
-                table_html += f'<td class="score-cell">{get_score_bar(accuracy)}</td>'
+            # Add score bars in new order: F1, Recall, Precision, Accuracy
+            if f1 != '':
+                table_html += f'<td class="score-cell">{get_score_bar(f1)}</td>'
             else:
                 table_html += '<td class="numeric-cell">-</td>'
                 
-            if precision != '':
-                table_html += f'<td class="score-cell">{get_score_bar(precision)}</td>'
+            if recall != '':
+                table_html += f'<td class="score-cell">{get_score_bar(recall)}</td>'
             else:
                 table_html += '<td class="numeric-cell">-</td>'
                 
-            if recall != '':
-                table_html += f'<td class="score-cell">{get_score_bar(recall)}</td>'
+            if precision != '':
+                table_html += f'<td class="score-cell">{get_score_bar(precision)}</td>'
             else:
                 table_html += '<td class="numeric-cell">-</td>'
                 
-            if f1 != '':
-                table_html += f'<td class="score-cell">{get_score_bar(f1)}</td>'
+            if accuracy != '':
+                table_html += f'<td class="score-cell">{get_score_bar(accuracy)}</td>'
             else:
                 table_html += '<td class="numeric-cell">-</td>'
                 
@@ -208,6 +210,8 @@ def create_pii_leaderboard():
             table_html += f"""
                     <td class="numeric-cell">{cost_display}</td>
                     <td class="numeric-cell">{time_display}</td>
+                    <td>{get_type_badge(row['Model Type'])}</td>
+                    <td>{row['Vendor']}</td>
                 </tr>
             """
         
@@ -400,7 +404,7 @@ def create_pii_leaderboard():
     
     # Load initial data
     initial_df = load_leaderboard_data()
-    initial_table = filter_and_sort_data("All", "All", "Overall Accuracy", "Descending")
+    initial_table = filter_and_sort_data("All", "All", "F1 Score", "Descending")
     
     # Display header
     gr.HTML(HEADER_CONTENT)
@@ -410,11 +414,11 @@ def create_pii_leaderboard():
     <div class="dark-container" style="margin-bottom: 32px;">
         <div class="section-header">
             <span class="section-icon" style="color: var(--accent-primary);">📈</span>
-            <h3 style="margin: 0; color: var(--text-primary); font-size: 1.5rem; font-family: 'Inter', sans-serif; font-weight: 700;">
+            <h3 style="margin: 0; color: var(--text-primary); font-size: 1.5rem; font-family: 'Archivo', sans-serif; font-weight: 700;">
                 PII Detection Performance Leaderboard
             </h3>
         </div>
-        <p style="color: var(--text-secondary); margin-bottom: 20px; font-size: 1.1rem; font-family: 'Inter', sans-serif;">
+        <p style="color: var(--text-secondary); margin-bottom: 20px; font-size: 1.1rem; font-family: 'Archivo', sans-serif;">
             Filter by document type, model access, and sort by any metric to explore performance
         </p>
         
@@ -451,8 +455,8 @@ def create_pii_leaderboard():
         
         with gr.Column(scale=1):
             sort_by = gr.Dropdown(
-                choices=["Overall Accuracy", "Precision", "Recall", "F1 Score", "Over-redaction Rate", "Cost per Document ($)", "Processing Time (s)"],
-                value="Overall Accuracy",
+                choices=["F1 Score", "Recall", "Precision", "Overall Accuracy", "Over-redaction Rate", "Cost per Document ($)", "Processing Time (s)"],
+                value="F1 Score",
                 label="📊 Sort By",
                 elem_classes=["dropdown"]
             )
@@ -490,11 +494,11 @@ def create_pii_leaderboard():
     <div class="dark-container" style="margin-top: 32px;">
         <div class="section-header">
             <span class="section-icon" style="color: var(--accent-primary);">🎯</span>
-            <h3 style="margin: 0; color: var(--text-primary); font-size: 1.5rem; font-family: 'Inter', sans-serif; font-weight: 700;">
+            <h3 style="margin: 0; color: var(--text-primary); font-size: 1.5rem; font-family: 'Archivo', sans-serif; font-weight: 700;">
                 Model Performance Cards
             </h3>
         </div>
-        <p style="color: var(--text-secondary); margin-bottom: 20px; font-size: 1.1rem; font-family: 'Inter', sans-serif; text-align: center;">
+        <p style="color: var(--text-secondary); margin-bottom: 20px; font-size: 1.1rem; font-family: 'Archivo', sans-serif; text-align: center;">
             Dive deep into individual model performance across all metrics and document types
         </p>
 
@@ -522,6 +526,10 @@ def create_pii_leaderboard():
     
     gr.HTML("""
             </div>
+            
+            <div style="text-align: center; margin-top: 24px; padding-top: 12px; border-top: 1px solid var(--border-subtle);">
+                <span style="color: var(--text-secondary); font-family: 'Archivo', sans-serif;">Powered by <a href=\"https://nutrient.io\" target=\"_blank\" rel=\"noopener noreferrer\" style=\"color: var(--accent-primary); font-weight: 700; text-decoration: none;\">Nutrient</a></span>
+            </div>
         </div>
     </div>""")
     
@@ -529,7 +537,7 @@ def create_pii_leaderboard():
     gr.HTML(f"""
     <style>
     .performance-card {{
-        background: linear-gradient(145deg, rgba(26, 20, 20, 0.98) 0%, rgba(222, 157, 204, 0.05) 100%);
+        background: var(--bg-card);
         border: 2px solid var(--accent-primary);
         border-radius: 24px;
         padding: 32px;
@@ -539,8 +547,8 @@ def create_pii_leaderboard():
         overflow: hidden;
         box-shadow: 
             0 20px 40px rgba(0, 0, 0, 0.5),
-            0 0 80px rgba(222, 157, 204, 0.2),
-            inset 0 0 120px rgba(222, 157, 204, 0.05);
+            0 0 80px rgba(240, 201, 104, 0.2),
+            inset 0 0 120px rgba(240, 201, 104, 0.08);
     }}
     
     .card-header {{
@@ -553,12 +561,10 @@ def create_pii_leaderboard():
     .card-model-name {{
         font-size: 2rem;
         font-weight: 800;
-        background: linear-gradient(135deg, var(--accent-primary) 0%, var(--accent-secondary) 100%);
-        -webkit-background-clip: text;
-        -webkit-text-fill-color: transparent;
+        color: var(--text-primary);
         margin-bottom: 8px;
-        text-shadow: 0 0 40px var(--glow-primary);
         line-height: 1.2;
+        font-family: 'Archivo', sans-serif;
     }}
     
     .card-stars {{
@@ -587,7 +593,7 @@ def create_pii_leaderboard():
     .metric-item:hover {{
         transform: translateY(-2px);
         border-color: var(--accent-primary);
-        box-shadow: 0 8px 16px rgba(222, 157, 204, 0.3);
+        box-shadow: 0 8px 16px rgba(240, 201, 104, 0.25);
     }}
     
     .metric-icon {{

results/pii_detection_results.csv

@@ -1,9 +1,5 @@
 Model,Model Type,Vendor,Overall Accuracy,Precision,Recall,F1 Score,Over-redaction Rate,Processing Time (s),Cost per Document ($),Healthcare Accuracy,Financial Accuracy,Government Accuracy,Legal Accuracy,Personal Accuracy
-GPT-4o,Proprietary,OpenAI,0.941,0.945,0.938,0.941,0.023,2.3,0.012,0.952,0.938,0.933,0.941,0.940
-Claude-3.5-Sonnet,Proprietary,Anthropic,0.928,0.932,0.924,0.928,0.031,3.1,0.015,0.939,0.925,0.920,0.928,0.927
-Gemini-1.5-Pro,Proprietary,Google,0.915,0.919,0.911,0.915,0.038,2.8,0.008,0.926,0.912,0.907,0.915,0.914
-LLaMA-3.1-70B,Open Source,Meta,0.882,0.887,0.877,0.882,0.052,4.2,0.003,0.893,0.879,0.874,0.882,0.881
-Mistral-Large,Proprietary,Mistral AI,0.871,0.875,0.867,0.871,0.048,3.7,0.011,0.882,0.868,0.863,0.871,0.870
-GPT-4o-mini,Proprietary,OpenAI,0.856,0.860,0.852,0.856,0.061,1.8,0.002,0.867,0.853,0.848,0.856,0.855
-Claude-3-Haiku,Proprietary,Anthropic,0.834,0.838,0.830,0.834,0.078,2.1,0.006,0.845,0.831,0.826,0.834,0.833
-Gemini-1.5-Flash,Proprietary,Google,0.821,0.825,0.817,0.821,0.085,2.4,0.004,0.832,0.818,0.813,0.821,0.820 
+Nutrient & GPT-5-mini,Proprietary,OpenAI,0.757,0.993,0.972,0.98,0.054,2.7,0.018,0.982,0.974,0.958,0.977,0.989
+Nutrient & GPT-5-nano,Proprietary,OpenAI,0.658,0.988,0.954,0.966,0.066,2.1,0.015,0.963,0.961,0.943,0.946,0.978
+Nutrient & GPT-4.1-mini,Proprietary,OpenAI,0.599,0.993,0.945,0.964,0.065,2.3,0.012,0.96,0.961,0.966,0.895,0.994
+Nutrient & GPT-4.1-nano,Proprietary,OpenAI,0.419,0.989,0.906,0.936,0.118,1.8,0.008,0.939,0.939,0.933,0.925,0.974