Update app.py

app.py

@@ -44,10 +44,12 @@ RULES = """<h1>OSV-5M (plonk)</h1>
 <h3> Click "Select" to finalize your selection and then "Next" to move to the next image.</h3>
 
 <h2> AI Competitors </h2>
-<h3> You will compete against two AIs: Plonk-AI (our best model) and Baseline-AI (a simpler approach). These AIs have not been trained on any of the images you will see; in fact, they haven't seen anything within a 1km radius of them. Like you, the AIs will need to pick up on geographic clues to pinpoint the locations of the images.</h3>
+<h3> You will compete against two AIs: Plonk-AI (our best model) and Baseline-AI (a simpler approach).</h3>
+<h3> These AIs have not been trained on any of the images you will see; in fact, they haven't seen anything within a 1km radius of them.</h3>
+<h3> Like you, the AIs will need to pick up on geographic clues to pinpoint the locations of the images.</h3>
 
 <h2> Geoscore </h2>
-<h3> The geoscore is calculated based on how close each guess is to the true location as in Geoguessr, with a maximum of 5000 points,  using the formula := 5000*exp(-d/1492.7) </h3>
+<h3> The geoscore is calculated based on how close each guess is to the true location as in Geoguessr, with a maximum of 5000 points. We use the formula $g(d) = 5000 \\exp(\\frac{-d}/{1492.7})$ </h3>
 """
 css = """
 @font-face {
@@ -80,6 +82,12 @@ h3 {
 
 space_js = """
 <script src="https://cdn.jsdelivr.net/npm/@rapideditor/[email protected]/dist/country-coder.iife.min.js"></script>
+<script type="text/x-mathjax-config">
+  MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}});
+</script>
+<script type="text/javascript"
+  src="http://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
+</script>
 <script>
 function shortcuts(e) {
     var event = document.all ? window.event : e;