Update index.html

index.html

@@ -172,17 +172,9 @@
             margin-top: 20px;
         }
         
-        .category-badge {
-            display: inline-block;
-            font-size: 48px;
-            font-weight: bold;
-            color: #667eea;
-            margin-bottom: 10px;
-        }
-        
         .type-name {
-            font-size: 24px;
-            font-weight: 600;
+            font-size: 48px;
+            font-weight: 700;
             color: #2c3e50;
         }
         
@@ -331,36 +323,9 @@
             </div>
             
             <div id="results" class="results" style="display: none;">
-                <h2>Your Results</h2>
+                <h2>Your AI Archetype</h2>
                 
-                <div class="stats-grid">
-                    <div class="stat-card">
-                        <div class="stat-label">Raw Count A</div>
-                        <div class="stat-value" id="countA">0</div>
-                    </div>
-                    <div class="stat-card">
-                        <div class="stat-label">Raw Count B</div>
-                        <div class="stat-value" id="countB">0</div>
-                    </div>
-                    <div class="stat-card">
-                        <div class="stat-label">Raw Count C</div>
-                        <div class="stat-value" id="countC">0</div>
-                    </div>
-                    <div class="stat-card">
-                        <div class="stat-label">Weighted Score A</div>
-                        <div class="stat-value" id="scoreA">0</div>
-                    </div>
-                    <div class="stat-card">
-                        <div class="stat-label">Weighted Score B</div>
-                        <div class="stat-value" id="scoreB">0</div>
-                    </div>
-                    <div class="stat-card">
-                        <div class="stat-label">Weighted Score C</div>
-                        <div class="stat-value" id="scoreC">0</div>
-                    </div>
-                </div>
                 <div class="final-result">
-                    <div class="category-badge" id="categoryBadge">-</div>
                     <div class="type-name" id="typeName">Complete the questionnaire</div>
                     <div id="deuceIndicator"></div>
                 </div>
@@ -371,9 +336,14 @@
     <script>
         const weights = [5, 4, 3, 2, 1];
         const categories = {
-            'A': 'Innovator/Blueprint',
-            'B': 'Maker/Builder/Engine',
-            'C': 'User/Vehicle'
+            'A': 'Pink!',
+            'B': 'Green!',
+            'C': 'Yellow!'
+        };
+        const categoryColors = {
+            'A': '#ff1493',
+            'B': '#00c853',
+            'C': '#ffd700'
         };
         
         function calculate() {
@@ -400,14 +370,6 @@
                 scores[ans] += weights[i];
             });
             
-            // Display counts and scores
-            document.getElementById('countA').textContent = counts['A'];
-            document.getElementById('countB').textContent = counts['B'];
-            document.getElementById('countC').textContent = counts['C'];
-            document.getElementById('scoreA').textContent = scores['A'];
-            document.getElementById('scoreB').textContent = scores['B'];
-            document.getElementById('scoreC').textContent = scores['C'];
-            
             // Determine category
             let category;
             let isDeuce = false;
@@ -438,14 +400,11 @@
             }
             
             // Display results
-            document.getElementById('categoryBadge').textContent = category;
-            document.getElementById('typeName').textContent = categories[category];
+            const resultText = `You're a "${categories[category]}"`;
+            document.getElementById('typeName').textContent = resultText;
+            document.getElementById('typeName').style.color = categoryColors[category];
             
-            if (isDeuce) {
-                document.getElementById('deuceIndicator').innerHTML = '<span class="deuce-indicator">DEUCE (Tie-broken by weight)</span>';
-            } else {
-                document.getElementById('deuceIndicator').innerHTML = '';
-            }
+            document.getElementById('deuceIndicator').innerHTML = '';
             
             document.getElementById('results').style.display = 'block';
         }