diff --git a/res/basic.css b/res/basic.css
new file mode 100644
index 0000000..e133165
--- /dev/null
+++ b/res/basic.css
@@ -0,0 +1,44 @@
+/* http://paletton.com/#uid=63T0u0k7O9o3ouT6LjHih7ltq4c */
+body {
+  font-family: sans-serif;
+  max-width: 40em;
+	background: #282a33;
+	color: #f6efdc;
+}
+a:any-link {
+	color: #8b969a;
+}
+h1 {
+	background: #5e576b;
+	color: #9e98a8;
+}
+.Fail, .Error {
+	background: #3a3119;
+	color: #ffcc98;
+}
+.Fail:before {
+	content: "Fail: ";
+}
+.Error:before {
+	content: "Error: ";
+}
+p {
+	margin: 1em 0em;
+}
+form, pre {
+	margin: 1em;
+}
+input {
+	padding: 0.6em;
+	margin: 0.2em;
+}
+nav {
+  border: solid black 2px;
+}
+nav ul, .category ul {
+  padding: 1em;
+}
+nav li, .category li {
+	display: inline;
+	margin: 1em;
+}
diff --git a/res/puzzles.html b/res/puzzles.html
new file mode 100644
index 0000000..4d1942e
--- /dev/null
+++ b/res/puzzles.html
@@ -0,0 +1,81 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>Open Puzzles</title>
+    <link rel="stylesheet" href="basic.css">
+    <meta name="viewport" content="width=device-width">
+    <link rel="icon" href="res/icon.svg" type="image/svg+xml">
+    <link rel="icon" href="res/icon.png" type="image/png">
+    <script>
+
+function render(obj) {
+  puzzlesElement = document.createElement('div');
+  let cats = [];
+  for (let cat in obj) {
+    cats.push(cat);
+    console.log(cat);
+  }
+  cats.sort();
+
+  for (let cat of cats) {
+    let puzzles = obj[cat];
+    
+    let pdiv = document.createElement('div');
+    pdiv.className = 'category';
+    
+    let h = document.createElement('h2');
+    pdiv.appendChild(h);
+    h.textContent = cat;
+    
+    let l = document.createElement('ul');
+    pdiv.appendChild(l);
+    
+    for (var puzzle of puzzles) {
+      var points = puzzle[0];
+      var id = puzzle[1];
+  
+      var i = document.createElement('li');
+      l.appendChild(i);
+  
+      if (points === 0) {
+  	    i.textContent = "‡";
+      } else {
+      	var a = document.createElement('a');
+      	i.appendChild(a);
+      	a.textContent = points;
+        a.href = cat + "/" + id + "/index.html";
+	    }
+  	}
+
+		puzzlesElement.appendChild(pdiv);
+		document.getElementById("puzzles").appendChild(puzzlesElement);
+  }
+}
+
+function init() {
+	fetch("puzzles.json")
+	.then(function(resp) {
+		return resp.json();
+	}).then(function(obj) {
+		render(obj);
+	}).catch(function(err) {
+		console.log("Error", err);
+	});
+}
+
+document.addEventListener("DOMContentLoaded", init);
+    </script>
+  </head>
+  <body>
+    <h1 class="Success">Open Puzzles</h1>
+    <section>
+      <div id="puzzles"></div>
+    </section>
+    <nav>
+      <ul>
+        <li><a href="puzzles.html">Puzzles</a></li>
+        <li><a href="scoreboard.html">Scoreboard</a></li>
+      </ul>
+    </nav>
+  </body>
+</html>
diff --git a/res/scoreboard.html b/res/scoreboard.html
new file mode 100644
index 0000000..9d2d513
--- /dev/null
+++ b/res/scoreboard.html
@@ -0,0 +1,147 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>Open Puzzles</title>
+    <link rel="stylesheet" href="basic.css">
+    <meta name="viewport" content="width=device-width">
+    <link rel="icon" href="res/icon.svg" type="image/svg+xml">
+    <link rel="icon" href="res/icon.png" type="image/png">
+    <script>
+function loadJSON(url, callback) {
+	function loaded(e) {
+		callback(e.target.response);
+	}
+	var xhr = new XMLHttpRequest()
+	xhr.onload = loaded;
+	xhr.open("GET", url, true);
+	xhr.responseType = "json";
+	xhr.send();
+}
+
+function scoreboard(element, continuous) {
+	function update(state) {
+		var teamnames = state["teams"];
+		var pointslog = state["points"];
+		var pointshistory = JSON.parse(localStorage.getItem("pointshistory")) || [];
+		if (pointshistory.length >= 20){
+			pointshistory.shift();
+		}
+		pointshistory.push(pointslog);
+		localStorage.setItem("pointshistory", JSON.stringify(pointshistory));
+		var highscore = {};
+		var teams = {};
+
+		// Dole out points
+		for (var i in pointslog) {
+			var entry = pointslog[i];
+			var timestamp = entry[0];
+			var teamhash = entry[1];
+			var category = entry[2];
+			var points = entry[3];
+
+			var team = teams[teamhash] || {__hash__: teamhash};
+
+			// Add points to team's points for that category
+			team[category] = (team[category] || 0) + points;
+
+			// Record highest score in a category
+			highscore[category] = Math.max(highscore[category] || 0, team[category]);
+
+			teams[teamhash] = team;
+		}
+
+		// Sort by team score
+		function teamScore(t) {
+			var score = 0;
+
+			for (var category in highscore) {
+				score += (t[category] || 0) / highscore[category];
+			}
+			// XXX: This function really shouldn't have side effects.
+			t.__score__ = score;
+			return score;
+		}
+		function teamCompare(a, b) {
+			return teamScore(a) - teamScore(b);
+		}
+
+		var winners = [];
+		for (var i in teams) {
+			winners.push(teams[i]);
+		}
+		if (winners.length == 0) {
+			// No teams!
+			return;
+		}
+		winners.sort(teamCompare);
+		winners.reverse();
+
+		// Clear out the element we're about to populate
+		while (element.lastChild) {
+			element.removeChild(element.lastChild);
+		}
+
+		// Populate!
+		var topActualScore = winners[0].__score__;
+
+		// (100 / ncats) * (ncats / topActualScore);
+		var maxWidth = 100 / topActualScore;
+		for (var i in winners) {
+			var team = winners[i];
+			var row = document.createElement("div");
+			var ncat = 0;
+			for (var category in highscore) {
+				var catHigh = highscore[category];
+				var catTeam = team[category] || 0;
+				var catPct = catTeam / catHigh;
+				var width = maxWidth * catPct;
+
+				var bar = document.createElement("span");
+				bar.classList.add("cat" + ncat);
+				bar.style.width = width + "%";
+				bar.textContent = category + ": " + catTeam;
+				bar.title = bar.textContent;
+
+				row.appendChild(bar);
+				ncat += 1;
+			}
+
+			var te = document.createElement("span");
+			te.classList.add("teamname");
+			te.textContent = teamnames[team.__hash__];
+			row.appendChild(te);
+
+			element.appendChild(row);
+		}
+	}
+
+	function once() {
+		loadJSON("points.json", update);
+	}
+	if (continuous) {
+		setInterval(once, 60000);
+	}
+	once();
+}
+
+function init() {
+	var sb = document.getElementById("scoreboard");
+	scoreboard(sb, true);
+}
+
+document.addEventListener("DOMContentLoaded", init);
+    </script>
+  </head>
+  <body>
+    <h1 class="Success">Scoreboard</h1>
+    <section>
+      <div id="scoreboard"></div>
+    </section>
+    <nav>
+      <ul>
+        <li><a href="puzzles.html">Puzzles</a></li>
+        <li><a href="scoreboard.html">Scoreboard</a></li>
+      </ul>
+    </nav>
+  </body>
+</html>
diff --git a/src/handlers.go b/src/handlers.go
index 198c27a..527d4d7 100644
--- a/src/handlers.go
+++ b/src/handlers.go
@@ -5,9 +5,11 @@ import (
 	"encoding/json"
 	"fmt"
 	"io"
+	"io/ioutil"
 	"log"
 	"net/http"
 	"os"
+	"rand"
 	"strconv"
 	"strings"
 )
@@ -285,13 +287,15 @@ func (ctx Instance) puzzlesHandler(w http.ResponseWriter, req *http.Request) {
 }
 
 func (ctx Instance) pointsHandler(w http.ResponseWriter, req *http.Request) {
-	log := ctx.PointsLog()
-	jlog, err := json.Marshal(log)
+	plog := ctx.PointsLog()
+	jlog, err := json.Marshal(plog)
 	if err != nil {
 		http.Error(w, err.Error(), http.StatusInternalServerError)
 		return
 	}
 
+	// XXX: go through plog, building an array of teams, so we can anonymize team IDs
+
 	w.Header().Set("Content-Type", "application/json")
 	w.WriteHeader(http.StatusOK)
 
diff --git a/src/static.go b/src/static.go
index ee788ca..4176ef4 100644
--- a/src/static.go
+++ b/src/static.go
@@ -97,14 +97,14 @@ h1 {
 	background: #5e576b;
 	color: #9e98a8;
 }
-h1.Fail, h1.Error {
+.Fail, .Error {
 	background: #3a3119;
 	color: #ffcc98;
 }
-h1.Fail:before {
+.Fail:before {
 	content: "Fail: ";
 }
-h1.Error:before {
+.Error:before {
 	content: "Error: ";
 }
 p {
@@ -117,15 +117,15 @@ input {
 	padding: 0.6em;
 	margin: 0.2em;
 }
-li {
-	margin: 0.5em 0em;
-}
 nav {
   border: solid black 2px;
 }
-nav li {
+nav ul, .category ul {
+  padding: 1em;
+}
+nav li, .category li {
 	display: inline;
-	margin: 2em;
+	margin: 1em;
 }
 		`,
 	)
@@ -158,7 +158,136 @@ func staticScoreboard(w http.ResponseWriter) {
 	ShowHtml(
 		w, Success,
 		"Scoreboard",
-		"XXX: This would be the scoreboard",
+		`
+    <section>
+      <div id="scoreboard"></div>
+    </section>
+    <script>
+function loadJSON(url, callback) {
+	function loaded(e) {
+		callback(e.target.response);
+	}
+	var xhr = new XMLHttpRequest()
+	xhr.onload = loaded;
+	xhr.open("GET", url, true);
+	xhr.responseType = "json";
+	xhr.send();
+}
+
+function scoreboard(element, continuous) {
+	function update(state) {
+		var teamnames = state["teams"];
+		var pointslog = state["points"];
+		var pointshistory = JSON.parse(localStorage.getItem("pointshistory")) || [];
+		if (pointshistory.length >= 20){
+			pointshistory.shift();
+		}
+		pointshistory.push(pointslog);
+		localStorage.setItem("pointshistory", JSON.stringify(pointshistory));
+		var highscore = {};
+		var teams = {};
+
+		// Dole out points
+		for (var i in pointslog) {
+			var entry = pointslog[i];
+			var timestamp = entry[0];
+			var teamhash = entry[1];
+			var category = entry[2];
+			var points = entry[3];
+
+			var team = teams[teamhash] || {__hash__: teamhash};
+
+			// Add points to team's points for that category
+			team[category] = (team[category] || 0) + points;
+
+			// Record highest score in a category
+			highscore[category] = Math.max(highscore[category] || 0, team[category]);
+
+			teams[teamhash] = team;
+		}
+
+		// Sort by team score
+		function teamScore(t) {
+			var score = 0;
+
+			for (var category in highscore) {
+				score += (t[category] || 0) / highscore[category];
+			}
+			// XXX: This function really shouldn't have side effects.
+			t.__score__ = score;
+			return score;
+		}
+		function teamCompare(a, b) {
+			return teamScore(a) - teamScore(b);
+		}
+
+		var winners = [];
+		for (var i in teams) {
+			winners.push(teams[i]);
+		}
+		if (winners.length == 0) {
+			// No teams!
+			return;
+		}
+		winners.sort(teamCompare);
+		winners.reverse();
+
+		// Clear out the element we're about to populate
+		while (element.lastChild) {
+			element.removeChild(element.lastChild);
+		}
+
+		// Populate!
+		var topActualScore = winners[0].__score__;
+
+		// (100 / ncats) * (ncats / topActualScore);
+		var maxWidth = 100 / topActualScore;
+		for (var i in winners) {
+			var team = winners[i];
+			var row = document.createElement("div");
+			var ncat = 0;
+			for (var category in highscore) {
+				var catHigh = highscore[category];
+				var catTeam = team[category] || 0;
+				var catPct = catTeam / catHigh;
+				var width = maxWidth * catPct;
+
+				var bar = document.createElement("span");
+				bar.classList.add("cat" + ncat);
+				bar.style.width = width + "%";
+				bar.textContent = category + ": " + catTeam;
+				bar.title = bar.textContent;
+
+				row.appendChild(bar);
+				ncat += 1;
+			}
+
+			var te = document.createElement("span");
+			te.classList.add("teamname");
+			te.textContent = teamnames[team.__hash__];
+			row.appendChild(te);
+
+			element.appendChild(row);
+		}
+	}
+
+	function once() {
+		loadJSON("points.json", update);
+	}
+	if (continuous) {
+		setInterval(once, 60000);
+	}
+	once();
+}
+
+function init() {
+	var sb = document.getElementById("scoreboard");
+	scoreboard(sb, true);
+}
+
+document.addEventListener("DOMContentLoaded", init);
+    </script>
+		`,
 	)
 }
 
@@ -167,11 +296,12 @@ func staticPuzzles(w http.ResponseWriter) {
 		w, Success,
 		"Open Puzzles",
 		`
-<div id="puzzles"></div>
+<section>
+	<div id="puzzles"></div>
+</section>
 <script>
-
 function render(obj) {
-	let element = document.getElementById("puzzles");
+  puzzlesElement = document.createElement('div');
   let cats = [];
   for (let cat in obj) {
     cats.push(cat);
@@ -209,7 +339,8 @@ function render(obj) {
 	    }
   	}
 
-		element.appendChild(pdiv);
+		puzzlesElement.appendChild(pdiv);
+		document.getElementById("puzzles").appendChild(puzzlesElement);
   }
 }
 
@@ -224,7 +355,7 @@ function init() {
 	});
 }
 
-window.addEventListener("load", init);
+document.addEventListener("DOMContentLoaded", init);
 </script>
 		`,
 	)
