body { font-family: Tahoma, sans-serif; margin: 0; padding: 0; background: #f5f5f5; } .header { background: #333; color: white; padding: 20px; border-bottom: 3px solid #42a5f5; } .header h1 { margin: 0 0 5px 0; } .header p { margin: 0; color: #ccc; } .benchmark-selector { background: #f0f0f0; padding: 15px 20px; border-bottom: 2px solid #333; display: flex; gap: 15px; align-items: center; } .benchmark-selector label { font-weight: bold; font-size: 14px; } .benchmark-selector select { padding: 8px 12px; border: 2px solid #42a5f5; border-radius: 4px; background: white; color: #333; font-size: 14px; font-weight: bold; cursor: pointer; min-width: 200px; } #benchmark-content { padding: 20px; } .welcome-message { text-align: center; padding: 60px 20px; color: #666; } .welcome-message h2 { color: #333; } .load-button { padding: 8px 20px; background: #66bb6a; color: white; border: none; border-radius: 4px; cursor: pointer; font-weight: bold; font-size: 14px; margin-bottom: 20px; } .load-button:hover { background: #43a047; } .error-message { color: #d32f2f; padding: 20px; background: #ffebee; border: 2px solid #ef5350; border-radius: 8px; margin: 20px; max-width: 800px; } .error-message h3 { margin-top: 0; color: #c62828; } .error-message pre { background: #f5f5f5; padding: 10px; border-radius: 4px; overflow-x: auto; color: #333; font-family: monospace; font-size: 13px; } .stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; margin-top: 10px; } .stat-item { padding: 12px; background: white; border: 1px solid #ddd; border-radius: 4px; text-align: center; } .stat-label { font-weight: bold; color: #666; font-size: 12px; margin-bottom: 5px; } .stat-value { font-size: 24px; color: #333; font-weight: bold; } .qa-results { margin-top: 20px; } .qa-item { margin-bottom: 15px; border-radius: 8px; }